Quick CSS issue....

by 2 replies
3
Ok so I want my two columns to be side by side, hence my code is this:


div.sidebar {
background:#FFFFFF;
float:left;
width:200px;
}

div.main {
background:#FFFFFF;
float:right;
width:600px;
}


When I add the following code to the sidebar bit of my css:

border-right: #999999 1px solid

The main column still appears on the right but below the left column :-S

Any ideas how I can keep my border on the right of the menu but still have the main column by it's side? Thank you :-s
#website design #css #issue #quick
  • Is there a main container div? Check to make sure this is set to a value that will contain both a column of 200px and a column of 600px
    • [ 1 ] Thanks
    • [1] reply
    • Code:
      #container {
width:801px;
}

#sidebar { 
background:#CCCCCC;
float:left;
width:200px;
border-right: 1px solid;
}
#main { 
background:#CCCCFF;
float:right;
width:600px;
}
      A 1px border will take up an extra 1px of space meaning your overall left menu is now 201px
      • [ 1 ] Thanks
Join the discussion

Next Topics on Trending Feed