[WSG] Two images on the one line

[Mani Sheriar]

Try this:

XHTML
-------
<div id="container">
        <div class="left">
                <img src="left.gif" alt="Left Image" width="250"
height="250" />
                <p>Caption for left image</p>
        </div>
        <div class="right">
                <img src="rght.gif" alt="Right Image" width="250"
height="250" />
                <p>Caption for right image</p>
        </div>  
</div>

CSS
-----
#container {
        width:600px;
        border:1px solid black;
        margin:auto;
        overflow:auto;
        }
.left {
        float:left;
        }
.right {
        float:right;
        }
.left img, .right img {
        padding:5px;
        border:1px solid #ccc;
        }
.left p, .right p {
        margin:4px auto;
        width:192px;
        text-align:center;
        font:bold .8em/.8em verdana, arial, sans-serif;
        color:#666;
        }

View it: http://www.manisheriar.com/wsg/twoImages/ 

Mani Sheriar 
Sheriar Designs | www.ManiSheriar.com� 
925.952.4365 (landline) | 925.914.0741 (cell) 
�


******************************************************
The discussion list for  http://webstandardsgroup.org/

 See http://webstandardsgroup.org/mail/guidelines.cfm
 for some hints on posting to the list & getting help
******************************************************