Member Offer
  1. This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn More.

Website layout question

Discussion in 'Website Design Forum:' started by YesYouMay, Jan 26, 2010.

  1. YesYouMay

    YesYouMay Junior Member

    Css and website layout question:

    What do I edit below to get only two columns for my website? Anyone that can help, appreciated, thanks.


    body {
    background-color: #FFFFFF;
    margin: 0 0 0 0;
    font-size:12px;
    font-family:Tahoma;

    }
    .bodytable {
    width: 100%;
    border: 0px solid #000000;
    border-collapse:collapse;
    padding: 0px;
    margin: auto;
    }



    /* 3 column main table */
    .maintable {
    width: 100%;
    border: 0px solid #AAAAAA;
    border-collapse: collapse;
    padding: 2px;
    margin: 2px;
    margin-left: 0px;
    }

    /*columns in main table */
    .leftcolumn {
    width: 150px;
    padding:4px;
    }
    .centercolumn {
    padding:4px;
    }
    .rightcolumn {
    width: 150px;
    padding:4px;
    }
     
  2. glenwheeler

    glenwheeler Senior Member

    Hey there can u let me see the layout at the moment, seems like a 3 column layout all you will need to do is remove a class or ID and just stretch a column to fit the container...show me the screenshot of the page layout and I should be able to go from that for you :)
     
  3. mike_watts

    mike_watts Member

    body {
    background-color: #FFFFFF;
    margin: 0 0 0 0;
    font-size:12px;
    font-family:Tahoma;
    }
    .bodytable {
    width: 980px; /*set this to your width */
    padding: 0px;
    margin: auto;
    }
    .maintable {
    width: 980px; /*set this to your width */
    padding: 2px;
    margin: 2px;
    margin-left: 0px;
    }

    /*columns */
    .leftcolumn {
    width: 150px;
    padding:4px;
    float:left;
    }
    .rightcolumn {
    width: 810px; /* May need to reduce or increase this */
    padding:4px;
    float:left;
    margin-left:160px;
    }

    <div class="bodytable">
    <div class="maintable">

    <div class="leftcolumn">
    </div>
    <div class="rightcolumn">
    </div>

    </div>
    </div>

    Does this work/help, haven't tested it?
     
  4. Harry

    Harry Senior Member

Share This Page