changing percent based templates to fixed width

[Guest]

Hi all.
My buddy is using the Mozilla theme and Id like to set it to a fixed width (750px) ...is there a quick way to do this?

[JustinS]

Yes,

Simple open up the /templates/mozilla/style.css (whatever css file it is in the templates dir..)

Find the section:

Code: Select all

#mainpane {
    text-align: left;
    padding: 0px;
    width: 656px;
    background-color: #fff;
    margin: auto;
}

#serendipityRightSideBar {
    width: 150px;
    padding: 10px;
    background-color: #9CF;
    border-left: 5px solid #06C;
    vertical-align: top;
}

#serendipityLeftSideBar {
    width: 150px;
    padding: 10px;
    vertical-align: top;
    background-color: #06C;
}

#serendipity_banner {
    font-family: Helvetica, Arial, sans-serif;
    color: #FFFFFF;
    background: #9CF url(http://www.justinshattuck.com/bgHeader.jpg);
    text-align: left;
    width: 652px;
    height: 280px;
    margin:auto;
	
}

You'll basically just alter the width lines, to reflect the widths you wish to use. I'm not going to give you the exact proportions because some themes have padding and borders that other's done. The main pane is the MAIN PANEL of the site. Body is the encapsulating layer that holds everything. Then Main Pane holds the left and right bars, + banner etc. Just make sure that your content section + left or and right side bars + borders and any padding between equals your mane pane, not larger or it'll screw up the display.

Let me know man, regards,

Justin