CSS code for 3/4 column (3 posts)

  1. ainunez
    Posted 3 years ago #


    I want to create a 3/4 column and then a 1/4 column side by side. How do I create the css/html for that?

    The website is http://fuel.thebettyrocker.com/

    Thanks for your help.

  2. ainunez
    Posted 3 years ago #

    I saw this in another thread... I just want to know how to modify it to reflect a 3/4 and 1/4 column.

    <div class="column">Column 1</div>
    <div class="column">Column 2</div>
    <div class="column">Column 3</div>
    <div class="column">Column 4</div>
    <div class="clear"></div>

    Make sure you include the following CSS in your style sheet:

    .column {
    float: left;
    width: 200px;
    padding: 10px;
    .clear {
    width: 100%;
    clear: both;
  3. David Jensen
    Posted 3 years ago #

    Here is an example if you want a sidebar on the left side. The sidebar is set at 200px. You do not need 4 columns to create a 1/4 sidebar and a 3/4 content area. Just use 2 columns, and set the width for the sidebar to 25% and the content to 75%.

    In my example the sidebar is a fixed 200px, with a 10px space between the sidebar and main column. This is just a basic example but should get you started.

Topic Closed

This topic has been closed to new replies.

About this Topic


No tags yet.