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

Foto in die Mitte positionieren !

Status
Für weitere Antworten geschlossen.
Moin,

Das wird daran liegen, dass img ein Inline-Element ist. ;-)

Gruß,
-Efchen

sorry, vielleicht etwas zur Erläuterung:

img ist kein reines Inline-Element.

Genauer gesagt sind img's eine Mischung aus Inline,- und Block-Boxen und deswegen heißen sie Inline-Block-Boxen.

Im Fließtext blockiert die Grafik den nach oben benötigten Platz und schiebt die Zeilen darüber so weit weg wie nötig.
Normale Inline-Elemente tun so etwas nicht. Sie schieben nichts weg.
Das tun nur Blockelemente.
Aber die würden wiederum in einer eigenen Zeile stehen.

Inline-Block-Boxen verhalten sich gemischt:
- Sie fließen wie Inline-Boxen in einer Zeile mit
-Sie schieben aber wie Blockelelemente die Zeilen darüber und darunter so
weit auseinander, das sie selbst dazwischen passen.

Zur Gestaltung von Inline-Block-Boxen kann man bis auf zwei Ausnahmen das klassische Boxmodell benutzen:
- Ohne Angabe von width werden Inline-Block-Boxen nur so breit wie ihr
Inhalt und nicht so breit wie es geht
-Es gibt keine "collapsing Margins"

Die anderen Box-Modell-Eigenschaften height, padding und border funktionieren so wie bei Blockelementen.
(teilweise aus Peter Müllers "Little Boxes 2" zitiert, weil er so anschaulich erklären kann :wink:)

koslowski

edit. sorry für meine Schulmeisterei, aber imho ist meine Erläuterung nicht ganz unwichtig um das img-Element im Zusammenhang mit dem Boxmodell zu verstehen.:smile:
 
Zuletzt bearbeitet:
img ist kein reines Inline-Element.
Genauer gesagt sind img's eine Mischung aus Inline,- und Block-Boxen und deswegen heißen sie Inline-Block-Boxen.

edit. sorry für meine Schulmeisterei, aber imho ist meine Erläuterung nicht ganz unwichtig um das img-Element im Zusammenhang mit dem Boxmodell zu verstehen.

Ist schon okay, Du hast ja recht. Mir war nicht geläufig, dass es dafür auch einen Begriff gibt, Inline-Block-Boxen höre ich zum ersten Mal.

Und ja, es ist wichtig, dass diese kleinen Unterschiede erklärt werden, ich persönlich kann das mit der Schulmeisterei eigentlich auch ganz gut ;-) aber meine Erfahrung hat gezeigt, dass aufgrund solcher scheinbarer "Flüchtigkeitsfehler" oftmals das ganze Verständnis nicht rüberkommt.

So ähnlich, wie alle Welt davon redet, dass die "Auflösung" beim Erstellen von Websites eine Rolle spielt. Sie meinen womöglich das richtige, aber wenn das auch jeder verstehen würde, würde es keine echten Auflösungsweichen geben, die per JavaScript screen.width und so abfragen. Und die wenigsten machen sich dann auch Gedanken, dass man ja auch sein Fenster verkleinern kann.

Also gibts eine Verbeugung vor dem Meister :-) für die Korrektur.

Gruß,
-Efchen
 
Status
Für weitere Antworten geschlossen.
Zurück
Oben