Hallo zusammen,
solange meine Flex-Elemente nebeneinander stehen ist alles ok, bei kleinen Ausgabegeräten sind meine beiden Elemente untereinander nicht mittig ausgerichtet... Was habe ich übersehen bzw. falsch definiert?
Schonmal vielen Dank für Eure Tipps!
solange meine Flex-Elemente nebeneinander stehen ist alles ok, bei kleinen Ausgabegeräten sind meine beiden Elemente untereinander nicht mittig ausgerichtet... Was habe ich übersehen bzw. falsch definiert?
HTML:
<ul class="flex-container">
<li class="flex-element"> --- </li>
<li class="flex-element"> --- </li>
</ul>
CSS:
.flex-container {
margin-bottom: 25px;
padding:0;
display: -webkit-box;
display: -moz-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-webkit-flex-flow: row wrap;
justify-content: space-around;
list-style: none;
}
.flex-element {
max-width:510px;
padding: 8px 8px 0 8px;
text-align: justify;
border: solid 1px #ccc;
background-color:#fff;
box-shadow: 0 0 5px black;
border-top-right-radius: 10px;
border-top-left-radius: 10px;
margin:0 0 10px 0;
}
Schonmal vielen Dank für Eure Tipps!