[css]

[Anbu]

Hi,

ich versuche seit längerem ein Bild in einem Div Vertikal zu zentrieren.

Hab schon viel probiert:
- p drum rum und versucht das zu zentrieren
- div drum rum mit display table-cell
- div drum rum mit position relative, top50%, margin-top: -50%
und noch mehr an das ich mich grad nicht mehr erinnern kann.

hier wäre das betreffende Div in dem das Bild ist in meiner css

.width66img {
width: 63.9%;
text-align: center;
height: 310px;
}

ich hoffe jemand kann mir helfen bin mit meinem Latein am Ende.

[chefadmin]

Hi,

ich versuche seit längerem ein Bild in einem Div zu zentrieren.

Hab schon viel probiert:
- p drum rum und versucht das zu zentrieren
- div drum rum mit display table-cell
- div drum rum mit position relative, top50%, margin-top: -50%
und noch mehr an das ich mich grad nicht mehr erinnern kann.

hier wäre das betreffende Div in dem das Bild ist in meiner css

.width66img {
width: 63.9%;
text-align: center;
height: 310px;
}

ich hoffe jemand kann mir helfen bin mit meinem Latein am Ende.

Du solltest bei der breiten angabe eventuell feste zahlen nehmen (z.b. 800px), versuchs mal ansonsten müsstest etwas mehr quellcode posten, so kann ich nicht alles sehen um den fehler zu finden

villeicht auch position fixed mal sehen ich weiß leider nicht wie dein seitenaufbau ist

[Anbu]

zum seitenaufbau:

<div>
    <div>
        <div class="width66img"><img></div>
    </div>
</div> 

es geht mir ja nur darum dass Bild im Div zu zentrieren da ist es ja im prinzip egal was um das Div drum rum ist.

war mir bisjetzt auch keine Hilfe

dreh am rad

[chefadmin]

also wenn feste breitenangaben auch nichts bringen, ich weise meistens einer überschrift die ich nicht nehme (z.b. h5 oder h6 dann text-align : center; zu ) und dann das img tag zwischen h5 das klappt so mache ich es meistens

Ist bestimmt nicht die elganteste Lösung aber es klappt

[Anbu]

oh ich glaub wir reden aneinander vorbei ich mein natürlich Vertikal zentieren. sorry

[CiaoSen]

Gib dem Bild mal den style:

margin-left: auto;
margin-right: auto;

sollte dann mittig sein, aber nur Horizontal.
P.s. Das Bild muss ein Block-Element sein.


mfg jura

Edit: antwort zu spät gesehen >

Also Vertikal, da funktioniert diese Technik nicht.
Aber was geht wäre

height: 200px;
position: relative;
top: 50%;
margin-top: -100px; (die hälfte an höhe vom bild)

[Anbu]

hmm also in margin-top die höhe vom Bild oder vom Div rein?

[Anbu]

Danke Danke Danke

hat geklappt

[chefadmin]

oh ich glaub wir reden aneinander vorbei ich mein natürlich Vertikal zentieren. sorry

Sorry @Anbu hattest ja im ersten Post Vertikal geschrieben, sogar deutschlich und ich hatte es überflogen und als Horizontal aufgenommen, Sorry . na gut jetzt ist es ja erledigt.