• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

Wie Bild am Ende des HTML Codes automatisch richtig mittig zentrieren

Status
Für weitere Antworten geschlossen.
W

web673

Neues Mitglied
Hi

Wie kann ich ein Bild am Ende des HTML Codes automatisch richtig mittig zentrieren (egal ob das bild dadurch rechts oder Links abgeschnitten wird
(es soll halt nach auflösungsveränderung trotzdem z.b wenn ich einen baum und ne wiese amche das 2000x300 ist das es genau bei 1000 in der mitte es bildschirmes ist.)..

Kann mir wer da helfen ?

Grüße
 
Code: 
<img style="textalign: center;" src=...>

oder

Code: 
<img style="display: block; width: 2000px; margin: 0 auto;" src=...>
 
hi

danke für deine antworten.. aber er zentriert es nicht... es is genau so wie wenn ich es normal einbinde..

gibts da ne funktionierende möglichkeit?

grüße
 
Code: 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
       "http://www.w3.org/TR/html4/loose.dtd">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Unbenanntes Dokument</title>
</head>
<body>
<img style="text-align: center;" src="bilder/unten_hg.png">

</body>
</html>

Funzt auch net xD... ich hab schon so viele versionen ausprobiert...

Es gibt keinen Link, da ich das Lokal mache... und da es sowieso nur der text oben ist..

Grüße
 
Versuchs mal mit meiner zweiten Variante:
Code: 
<img style="display: block; width: 2000px; margin: 0 auto;" src="bilder/unten_hg.png">

Damit sollte das Bild horizontal zentriert sein.
Wenn du es auch noch vertikal zentrieren willst, dann müsstest du danach vorgehen:
Horizontale und vertikale Zentrierung mit CSS


(sorry, in der ersten war ein Tippfehler)
 
Normalerweise sollte das klappen.
Steht dein Doctype in der allerersten Zeile?
Falls nicht, lösche mal alles, was davor steht.
Ansonsten besorge dir einen kostenlosten Webspace und lade die Seite mal testweise hoch, damit man sich alles im Gesamtzusammenhang ansehen kann.
 
ich habe webspace... aber das hat doch mit dem gesamtzusammenhang nichts zu tun, da ich gerade genau diesen code vor mir habe (der wo oben steht) und sonst is in der datei garnichzts weil ich das zu erst hinbekommen muss..

Grüße
 
Mit diesem Code ist das Bild horizontal zentriert, sowohl im FF als auch im IE.:
Code: 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
       "http://www.w3.org/TR/html4/loose.dtd">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Unbenanntes Dokument</title>
</head>
<body>
<img style="display: block; width: 2000px; height: 300px; margin: 0 auto;" src="bilder/unten_hg.png">

</body>
</html>

Ein Link dienst dazu um zu erkennen, ob sich evtl. doch noch ein anderer Fehler eingeschlichen hat.
Wie wird denn das Bild bei dir dargestellt? Wenn es 2000px breit ist, dann ist es selbst bei großen Browserfenster bildschirmfüllend.
 
Hi

es zentriert sich einfach nicht.. es gibt immer diesen horizontalen scrollbalken.....


es soll sich ja nach dem browserfenster richten was es aber nicht tut.

Grüße

Link (obwohl das jetzt nichts bringt):

Unbenanntes Dokument
 
Doch, das Bild ist korrekt zentriert.
Der Scrollbalken resultiert daraus, weil das Bild breiter als der Viewport ist.
Ich verstehe auch nicht ganz den Sinn dieser Grafik.

Vielleicht ist dir mit dieser Lösung eher geholfen:
Verwende mal zwei Einzelgrafiken, welche den farbigen Quadraten entsprechen.
Von denen weist du eine html und die andre body zu und positionierst sie mit "top left" bzw. "top right".
Das Prinzip ist hier erklärt: Zwei Hintergrundgrafiken zuweisen

die schieben sich dann je nach Fenstergröße zusammen oder gehen auseinander.
 
dann habt ihr das nicht verstanden wie ich das gemeint habe.... oder ich habe mich falsch ausgedrückt....

das bild soll rechts oder links abgeschnitten werden ... so wie wenn man ein überdimensionales hintergrundbild

so wie da nur ich möchte das bild unten und nicht als hintergrundbild haben.

Unbenanntes Dokument

vielleicht habe ich es jetzt "besser" darstellen können.

grüße
 
Dann hab ich dich nicht recht verstanden.
Vermutlich so (?)
Code: 
<img style="text-align: center;" src="bilder/unten_hg.png" width="100%" border="0" alt="">
 
Code: 
<img style="display: block; width: 2000px; margin: 0 auto;" src="bilder/unten_hg.png">
Bei diesem code sieht man die Zentrierung nur wenn du dein Browserfenster auf eine Innenbreite über 2000px einstellen kannst.
Wenn dein Bild, je nach Platz, nur ausschnittweise angezeigt werden soll verwende background-image (background-image: url (), background-position: 50%, 50%).
 
Das hatten wir schon.
Aber noch ein Hinweis zu meinem letzten Vorschlag:
Hier skaliert sich das Bild, wird also immer komplett angezeigt. Je nach Fenstergröße dann eben auch kleiner.
 
Status
Für weitere Antworten geschlossen.

Neueste Beiträge

Zurück
Oben