H and V centered div

[traucostar]

Hello!
Hope someone can help me.

I have this (The image is H and V Centered):


But I need this:

<style>
div.album1 {
padding-left:auto;
padding-right:auto;
height:120px; 
width:120px; 
background-color: green; 
text-align:center;
vertical-align:middle;
}
div.album2 {
height:100px; 
width:100px; 
background-color: blue; 
display:table-cell; 
position:relative; 
vertical-align:middle;
}
</style>

<div class="album1">
<div class="album2">
<img src="1.jpg">
</div>
</div> 

Thanks!!!

[hkp]

use align:center in the class div.album2. it is here..

<style>
div.album1 {
padding-left:auto;
padding-right:auto;
height:120px; 
width:120px; 
background-color: green; 
text-align:center;
vertical-align:middle;
}
div.album2 {
height:100px; 
width:100px; 
background-color: blue; 
display:table-cell; 
position:relative; 
vertical-align:middle;
align:center;
}
</style>

<div class="album1">
<div class="album2">
<img src="1.jpg">
</div>
</div>

[traucostar]

It doesnt work....

[forum_amnesiac]

Try this, you probably need to experiment with the 'top' and 'vspace' values.

<style>
div.album1 {
padding-left:auto;
padding-right:auto;
height:120px; 
width:120px; 
background-color: green; 
text-align:center;
}
div.album2 {
height:100px; 
width:100px;
position:relative;
top:10px;
background-color: blue; 
display:table-cell;
}
</style>

<div class="album1">
<div class="album2">
<img src="1.jpg" vspace="10">
</div>
</div>