Frage Container vertikal Zentrieren?

[Fr3ddy]

Hi,

ich habe einen Container(.content_wrap) den ich Vertikal Zentrieren möchte, er hat folgende styles:
- margin-left:50%;
- padding-top:20px;
- padding-right:20px;

Der darüber geordente Container (.container) hat folgende Styles:
- height: 400px
- width: 100%

Wenn ich .content_wrap die styles display: table-cell; und vertical-align:middle und .conatiner display:table;
wird .content_wrap zwar zetriert aber es geht über die volle breite und margin-left:50% wird übergangen.

Wie kann ich .content_wrap zentrieren, ohne es absolut zu machen, da es responsiv ist?

LG & Danke

 

[Tronjer]

Weder margin, noch padding oder table-dings, um vertikal und horizontal zu zentrieren.

Auf den Parent: display: flex; align-items: center; justify-content: center;

 

[Fr3ddy]

Super, dass passt, gibts da auch einen workaround für den IE9?

 

[MrMurphy]

Hallo

Nein, wozu auch? Der hat ähnlich wie der IE 8 einen Marktanteil von 0,5% mit sinkender Tendenz. Ein einfacher Fallback (horizontales Zentrieren mit Abstand oben und unten) reicht da vollkommen aus.

Gruss

MrMurphy

 

[scbawik]

gibts da auch einen workaround für den IE9?

Unterstütze den zwar auch schon länger nicht mehr, aber ich kenne doch auch Leute die noch unbelehrbar mit Win XP + IE9 unterwegs sind. Wenn also unbedingt nötig könntest du es mit einem Polyfill versuchen: https://github.com/10up/flexibility

Andererseits wäre es langfristig besser solche Individuen einfach auflaufen zu lassen.