CODEWITHSUNDEEP
csslayout
Ropstah
Ropstah

Reputation: 17804

How to fix width of column in two-column CSS lay out?

I'm having problems getting several divs to function as two columns. In the code below I want the container (or content) and right to act as two columns.

Is this even possible without changing the HTML?

Take the following HTML:

<body>
  <div id="top"></div>

  <div id="container">
    <div id="content">
    </div>
  </div>

  <div id="right">
  </div>

  <div id="bottom"></div>
</body>

Upvotes: 0

Views: 149

Answers (2)

422
422

Reputation: 5770

Doesnt anser your issue fully, as your question is a tad lightweight, but you can position divs however you want. Fiddle here: http://www.jsfiddle.net/ozzy/F3K8k/

Have updated fiddle: http://www.jsfiddle.net/ozzy/F3K8k/1/

Upvotes: 0

user356808
user356808

Reputation:

This will do what you want.

Markup

<body>
    <div id="top">top</div>
    <div id="container">
        <div id="content">
            content
         </div>
         <div id="right">
            right
         </div>
         <br style="clear:both" />
    </div>
    <div id="bottom">bottom</div>
</body>

CSS

#container {border:1px solid blue;}
#content, #right {float:left;}
#content {width:400px; border-right:1px solid blue;}

Upvotes: 1

Related Questions