1

So the HTML is divided using divs obviously

...
<div id="left">
content
</div>
<div id="right">
content
</div>    
<div id="main">
content
</div>
...

I would like to create a layout using CSS that gives us three columns.

|      |            |      |
|      |            |      |
| left |    main    |right |
|      |            |      |
|      |            |      |

The trick is that I would like the main part to be centred and 60% of width. Left and right to be 20% width.

There will be no images just plain text.

1
  • I just found a way to do this quite simply by using margin:auto for main and left:0 for left div and right:0 for right div. Also specified widths in %.
    – Tomasz
    Apr 17, 2011 at 18:34

1 Answer 1

1

There are lots of tutorials out there fore creating three column layouts, either fixed widths or flexible, fluid columns like you've asked for.

This is a good tutorial with a range of different layouts that should help you get started.

http://matthewjamestaylor.com/blog/ultimate-multi-column-liquid-layouts-em-and-pixel-widths

1
  • If you read their comments you can see they answered their own question
    – John Conde
    Apr 18, 2011 at 13:05

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.