Zur Navigation

Bild im div zentrieren [3]

21 Micha

Klar, logo! Da hätte ich jetzt aber auch selbst drauf kommen sollen. Gestern hatte ich nur 5 min Zeit zum Testen...

Danke nochmal!

Micha

30.05.2005 08:48

22 friesennils (Gast)

ziel
- zentrierte positionierung <img> in <div>


grundlage
<div> => text-align:center; ect.
<img> => vertical-align:middle; ect.


annahme
- <img> horizontal zentriert => abstand links & rechts!


idee / lösung

<div><span>&nbsp;</span><img><span>&nbsp;</span></div>

- im span die line-height css-hardverdrahtet definieren (z.b. per php dynamisch ect) / rest (font-size) per .css
- align immer noch center und durch die line height auch vertical middle
- line-height in der .ccs auf 100% zu setzen wäre der dynamische knaller funzt aber leider nicht
- VORSICHT nur in einem span den "style=line-height:;" einfliesen lassen, sonst wird addiert!!!


- ok
mac (os x 10.2.8) => safari / firefox / netscape
pc (w2000) => ie / firefox

- nö
mac => ie 5.5

- - -
info@raster-pixel.de

27.04.2007 11:40

23 erkan (Gast)

hi,
hatte das gleiche problem und bin auf einer anderen Seite auf folgendes gestoßen

IMG.displayed {
display: block;
margin-left: auto;
margin-right: auto }


<IMG class="displayed" src="..." alt="...">

hoffe bringt was, mein problem hats gelöst

MfG

23.04.2008 21:43

24 Rudy

IMG.displayed {
display: block;
margin-left: auto;
margin-right: auto }

Das ist keine verticale Zentrierung, nur eine horizontale. Bei IE auch nur, wenn das übergeordnete Element text-align:center hat, obwohl das eigentlich ja nur für inline-Elemente gilt.

23.04.2008 23:13 | geändert: 23.04.2008 23:13

... 4 Jahre und 8 Monate später ...

25 Der Atze (Gast)

Servus,

was auch recht einfach ist:

background-position: left center;

und schwubs sind die "Problemchen" verflogen ;)

01.01.2013 19:48

Beitrag schreiben (als Gast)





[BBCode-Hilfe]