2 pictures side by side centered with text block under

Discussion in 'CSS' started by cc4digital, May 6, 2009.

  1. #1
    What I am trying to do it put two pictures side by side center on the page with text under them streaching the full length of the container block.;)
    Problem: I don't know how to get the two image next to one another in the center of the page
    Currently I have-->
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>Untitled Document</title>
    <style type="text/css" media="all">
    <!--
    .container{ 
    } 
    
    .images{ 
    } 
    
    .text{ 
    text-align:center; 
    } 
    -->
    </style>
    
    </head>
    <body>
    
    <div class="container"> 
    	<div class="images">
    		<img src="http://charlescoughlin.com/ebay/081209_Dewalt/dewalt735ssm.jpg" width="186" height="157" />
    		<img src="http://charlescoughlin.com/ebay/081209_Dewalt/dewalt735ssm.jpg" width="190" height="155" /></div>
    	</div>
    	<div class="text">
    		Text that need to go under the pictures and fit between the container
    	</div> 
    </div> 
    
    </body>
    </html>
    
    Code (markup):

     
    cc4digital, May 6, 2009 IP
  2. hkmike

    hkmike Peon

    Messages:
    38
    Likes Received:
    1
    Best Answers:
    0
    Trophy Points:
    0
    #2
    Just do what you did to center the text. Add text-align: center; to .images {}
     
    hkmike, May 6, 2009 IP
  3. cc4digital

    cc4digital Peon

    Messages:
    2
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #3
    Yes, that worked. But here is what I ultimatly want to do.
    Have two pictures in a container with two columns. Thus I would like to have writing in each column. Try this--A picture is worth 1000 words.
    [​IMG]
     
    cc4digital, May 6, 2009 IP