Hallo, ich verzweifel grade mal wieder an einen div-Layout.
Ich will mehrere left gefloatete divs in einem übergeordnetem Container mittig zentrieren. Die Inhalte der inneren divs sollen dann noch vertikal zentriert werden. Beim googlen bin ich zwar auf mehrere Lösungen gestoßen, aber funktionieren tut es trotzdem nicht bei mir. Die divs bleiben Links zentriert und die Inhalte oben. Kann mir jemand sagen, wie ich das hinkriege? Danke schonmal im Vorraus.
Ich will mehrere left gefloatete divs in einem übergeordnetem Container mittig zentrieren. Die Inhalte der inneren divs sollen dann noch vertikal zentriert werden. Beim googlen bin ich zwar auf mehrere Lösungen gestoßen, aber funktionieren tut es trotzdem nicht bei mir. Die divs bleiben Links zentriert und die Inhalte oben. Kann mir jemand sagen, wie ich das hinkriege? Danke schonmal im Vorraus.
HTML:
<style type="text/css">
<!--
body {
background-color:#0066FF;
}
div {
position: relative;
padding: 10px;
float: left;
width: 320px;
border-width: 1px;
border-color: #ffe #aaab9c #ccc #fff;
border-style: solid;
height: 320px;
margin:auto;
vertical-align: middle;
}
div:hover {
border-color: #aaab9c #fff #fff #ccc;
}
#main {
position: absolute;
left:5%;
width:90%;
margin-bottom: 0px;
height: auto;
text-align:center;
}
-->
</style>
</head>
<body>
<div id="main">
<div><a href="#" target="_blank" ><img src="6619002.jpg" border="0" alt="6619002"/></a>
<br />6619002</div>
<div><a href="#" target="_blank" ><img src="6701001.jpg" border="0" alt="6701001"/></a>
<br />6701001</div>
<div><a href="#" target="_blank" ><img src="6290001.jpg" border="0" alt="6290001"/></a>
<br />6290001</div>
<div><a href="#" target="_blank" ><img src="7715002.jpg" border="0" alt="7715002"/></a>
<br />7715002</div>
<div><a href="#" target="_blank" ><img src="6610001.jpg" border="0" alt="6610001"/></a>
<br />6610001</div>
<div><a href="#" target="_blank" ><img src="6718070.jpg" border="0" alt="6718070"/></a>
<br />6718070</div>
</div>
</body>
