Div Issues

Hi…

i want to add some details in the cover photo image and the image width and height will be changed dynamically. That is i can upload any image in that portion, so according to the image and cover photo and the details of the image will be centered in the div. Please try this with the small image (100 x 180). can u help u for it? i pasted my coding below.

Note:
Image width and height will not be beyond 300 x 180

<style type=”text/css”>
html>body div img { /*hidden from IE 5-6 */
margin-top: 0; /* to clean up, just in case MS later supports valign! */
vertical-align: middle;
}
#photosImg {
width:290px;
height:199px;
float:right;
margin-top:2px;
vertical-align:middle;
display:block;
}
#invitationPhotos{
width:290px;
height:260px;
float:right;
}
#invitationPanelBody {
height:289px;
background-image: url(../images/bg_innerpanelbox.gif);
background-repeat: repeat-x;
background-position: left bottom;
}
#invitation{
width:780px;
height:260px;
margin:20px auto;
margin-left:50px;
}
#maininvitation{
border:1px solid #ccc;
width:450px;
height:199px;
float:left;
padding-right:10px;
}
#invitationCover{
width:300px;
height:210px;
float:left;
padding-top:10px;
padding-left:10px;
padding-right:0px;
}
#invitationtitle{
width:75px;
height:190px;
padding-top:10px;
padding-left:20px;
float:right;
}
#titlemain{
width:140px;
height:180px;
background-color:#FFFF00;
float:right;
}
#invitationPhotos{
width:290px;
height:260px;
float:right;
}

.coverImg{
width:321px;
height:195px;
text-align: center;
display: table-cell;
vertical-align: middle;
position: static;
}
.coverImg img{
margin-top: expression(( 199 – this.height ) / 2);
}
.invitationImgs{
border: 0;
padding: 5px;
float: right;
}
.invitationImgs div {
border: solid 1px gray;
width:120px;
height:92px;
display: table-cell;
vertical-align: middle;
text-align: center;
}
.invitationImgs img{margin-top: expression(( 92 – this.height ) / 2);}
#coverBtn {
width:233px;
height:10px;
margin-left:10px;
margin-top:0px;
}

</style>
<div id=”invitationPanelBody”>
<div id=”invitation”>
<div id=”maininvitation”>
<div id=”invitationCover” align=”right”>
<img align=”right” src=”http://192.168.2.213/celebration_dev/photovol/volume1/webpics/medpics/00/35/1_45_1226305612md3852efc21de712786bd4a38d367903d1.jpg” alt=”” width=”102″ height=”180″>
</div>
<div id=”invitationtitle”>
<div id=”titlemain”>
<div align=”center” style=”font-weight:bold; font-family:Arial, Verdana, Helvetica, sans-serif; font-size:14px;”>testing</div>
<div align=”center” style=”color:#000000; font-weight:bold; font-family:Arial, Verdana, Helvetica, sans-serif; font-size:10px;”>Wednesday, November 26, 2008</div>
<div align=”center” style=”color:#000000; font-weight:bold; font-family:Arial, Verdana, Helvetica, sans-serif; font-size:10px;”>4.00am – 10.00am</div>
<div align=”center” style=”color:#000000; font-weight:bold; font-family:Arial, Verdana, Helvetica, sans-serif; font-size:10px;”>Location Name</div>
<div align=”center” style=”color:#000000; font-weight:bold; font-family:Arial, Verdana, Helvetica, sans-serif; font-size:10px;”>Street</div>
<div align=”center” style=”color:#000000; font-weight:bold; font-family:Arial, Verdana, Helvetica, sans-serif; font-size:10px;”>City, NY</div>
<div align=”center”>Contact Information</div>
<div align=”center” style=”color:#000000; font-weight:bold; font-family:Arial, Verdana, Helvetica, sans-serif; font-size:10px;”>City, Ny</div>
<div align=”center” style=”color:#000000; font-weight:bold; font-family:Arial, Verdana, Helvetica, sans-serif; font-size:10px;”>Kumar, shiva</div>
<div align=”center” style=”color:#000000; font-weight:bold; font-family:Arial, Verdana, Helvetica, sans-serif; font-size:10px;” >98456789</div>
</div>
</div>
<div id=”coverBtn”><img src=”http://192.168.1.226/celebration/skin/images/btnset_viewuploadshare.gif” alt=”” usemap=”#Map440″ border=”0″></div>
</div>
<div id=”invitationPhotos”>
<div id=”photosImg”>
<div class=”invitationImgs” align=”center”><div><img src=”http://192.168.1.226/celebration/skin/images/img_no_photo_avilable.gif” alt=”” width=”90″ height=”80″></div></div>
<div class=”invitationImgs” align=”center”><div><img src=”http://192.168.1.230/celebration/photovol/volume1/webpics/thumbpics/16/99/1_48_1224761009tn2aed925948951157bc191b5aaf791bfb.jpg” alt=”” width=”90″ height=”64″></div></div>
<div class=”invitationImgs” align=”center”><div><img src=”http://192.168.1.226/celebration/skin/images/img_no_photo_avilable.gif” alt=”” width=”90″ height=”80″></div></div>
<div class=”invitationImgs” align=”center”><div><img src=”http://192.168.1.226/celebration/skin/images/img_no_photo_avilable.gif” alt=”” width=”90″ height=”80″></div></div>
</div>
<div id=”photosBtn”>
<div id=”buyPrints” align=”center”><img src=”http://192.168.1.226/celebration/skin/images/spacer.gif” alt=””></div>
<div id=”buyProducts” align=”center”><img src=”http://192.168.1.226/celebration/skin/images/spacer.gif” alt=””></div>
</div>
</div>
</div>
</div>

Also in #CSS _↴