how do i fix this? will take a second to do. please

Discussion in 'HTML & Website Design' started by sakib000, Jan 19, 2008.

0
  1. #1
    I want to align these boxes straight horizontally

    [​IMG]


        <div id="blockcontainer">
    <div id="blockone"></div>
    <div id="blocktwo"></div>
    <div id="blockthree"></div>
    </div>  


#blockcontainer{
width:960px;
padding:15px;
height:220px;
display:block;

}

#blockcontainer #blockone{
width:310px;
float:left;
background:#000066;
height:220px;
}

#blockcontainer #blocktwo{
width:310px;
margin-left:325px;
background:#000066;
height:220px;
}

#blockcontainer #blockthree{
width:310px;
float:right;
background:#000066;
height:220px;
}
    HTML:

     
    sakib000, Jan 19, 2008 IP
  2. nicangeli

    nicangeli Peon

    Messages:
    828
    Likes Received:
    23
    Best Answers:
    0
    Trophy Points:
    0
    #2
    Just tested this in FF 2, IE 7 and IE6 and it works the way i think you want it to. Correct me if a am wrong.


    HTML
    
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
    "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>
test for dp
</title>
<link rel="stylesheet" media="screen" href="style.css" type="text/css">
</head>

<body>
<div id="blockcontainer">
    <div id="blockone"></div>
    <div id="blocktwo"></div>
    <div id="blockthree"></div>
</div>  
</body>
</html>
    Code (markup):
    CSS
    
#blockcontainer{
width:960px;
padding:15px;
height:220px;
display:block;

}

#blockone{
width:310px;

float:left;
background:#000066;
height:220px;
}

#blocktwo{
width:310px;
float: left;
margin-left: 10px;
background:#000066;
height:220px;
}

#blockthree{
width:310px;
float: left;
margin-left: 10px;
background:#000066;
height:220px;
}
    Code (markup):
     
    nicangeli, Jan 19, 2008 IP
  3. sakib000

    sakib000 Active Member

    Messages:
    415
    Likes Received:
    17
    Best Answers:
    0
    Trophy Points:
    58
    #3
    seriously thanks bro........
     
    sakib000, Jan 19, 2008 IP
  4. jigolo

    jigolo Peon

    Messages:
    312
    Likes Received:
    2
    Best Answers:
    0
    Trophy Points:
    0
    #4
    very nice code....
     
    jigolo, Jan 20, 2008 IP