✔ Div im Div vertikal zentrieren

[hubbl]

Hallo,
ich habe folgende betroffene Quelltexte:

.member_wrapper{
    width: 540px;
    height: 100px;
    margin-top: 15px;
    padding: 5px;
    border: #880000 solid 1px;
}
.member_pic{
    width: 100px;
    height: 100px;
    background: url(sys_pics/nopic.jpg);
    float: left;
}
.member_info{
    position: relative;
    width: 425px;
    float: right;
    margin-top: auto;
    margin-bottom: auto;
}
.member_name{
    width: 425px;
}
.member_messenger{
    width: 425px;
}
.member_bike{
    width: 425px;
}

.member_info:after{
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}

in

<div class="member_wrapper">
<div class="member_pic">
</div>
<div class="member_info">
<div class="member_name">
Dennis 'hubbl' Otto
</div>
<div class="member_bike">
Bike: <i>keine Beschreibung</i></div>
<div class="member_messenger">
<img src="sys_pics/icq_icon.jpg" width="20" height="20" alt="Icq">276345584<img src="sys_pics/msn_icon.jpg" width="20" height="20" alt="Msn">mail@mail.de</div>
</div>
</div>

Wie bekomme ich das div "member_info" (in dem Befinden sich die drei anderen divs für name, beschreibung und messenger) vertikal zentriert?

Gruß Dennis

 

[Maik]

Hi,

hierfür müsste das Element eine Höhe besitzen, um es im Anzeigebereich vertikal zentriert positionieren zu können - beispielsweise:

.member_info{
    position: relative;
    width: 425px;
    float: right;
    margin-top: -30px;
    height: 60px;
    top: 50%;
}

oder:

.member_info{
    position: relative;
    width: 425px;
    float: right;
    margin-top: -2em;
    height: 4em;
    top: 50%;
}