Log in

View Full Version : Center Images


Rain Lover
03-26-2010, 11:43 AM
Hi,

I created a simple slideshow:


<html>
<body>

<div>
<iframe src="http://lh4.ggpht.com/_qkZzGyIkXmo/S6yTNbhSskI/AAAAAAAADKo/IjVMzaM42Kk/s800/image1.jpg" width="448" height="336" name="iframe_a">
</iframe>
</div>
<br>
<div>
<a href="http://lh4.ggpht.com/_qkZzGyIkXmo/S6yTNbhSskI/AAAAAAAADKo/IjVMzaM42Kk/s800/image1.jpg" target ="iframe_a"><img src="http://lh4.ggpht.com/_qkZzGyIkXmo/S6yTNbhSskI/AAAAAAAADKo/IjVMzaM42Kk/s800/image1.jpg" width="80" height="60"></a>
&nbsp;
<a href="http://lh3.ggpht.com/_qkZzGyIkXmo/S6yTTic4mTI/AAAAAAAADKs/4eJn_aJuMyk/s800/image2.jpg" target ="iframe_a"><img src="http://lh3.ggpht.com/_qkZzGyIkXmo/S6yTTic4mTI/AAAAAAAADKs/4eJn_aJuMyk/s800/image2.jpg" width="80" height="60"></a>
&nbsp;
<a href="http://lh5.ggpht.com/_qkZzGyIkXmo/S6yVdtKSofI/AAAAAAAADLQ/wSg6hOHzlFs/s800/image3.jpg" target ="iframe_a"><img src="http://lh5.ggpht.com/_qkZzGyIkXmo/S6yVdtKSofI/AAAAAAAADLQ/wSg6hOHzlFs/s800/image3.jpg" width="80" height="60"></a>
</div>

</body>
</html>

The problem is my images are of different sizes and they don't center in the iframe. How can I resolve the problem? Any suggestion is greatly appreciated!



Kind regards
Rain lover
BLiZZaRD
03-26-2010, 07:01 PM
make css for your iframe and set left and right margins to auto.



iframe {
height: 336px;
width: 448px;
margin-left: auto;
margin-right: auto;
}
Rain Lover
03-28-2010, 03:46 PM
make css for your iframe and set left and right margins to auto.



iframe {
height: 336px;
width: 448px;
margin-left: auto;
margin-right: auto;
}


It just centers the iframe, not the image inside it.