Monday, May 26, 2008

A friend said he needed help.

A friend said he needed help. He saw a lot of 'white space' on his screen when he modified his layout ( he moved the side-bar from the left side to the right ). I like the way his blog layout looks, and know that it is configured for easy viewing by folks with slower computers and those with older monitors that aren't as wide.

Friend, this is a short piece of css code that I copied from your page ( I changed the text color of the relevent figures to red ). You can access this css code by clicking on 'customize' ( between 'new post' and 'sign out' on the right side of the navigation bar ). Then click on 'edit html'. That will display a module similar to your blog generator, but the module will be filled with css code. Scroll down that list of code in that module until you see the words '#outer wrapper', and '#main wrapper'.

The red numbers that you see below are the size of the actual page, and the size of the main body ( blog ) on that page, respectivelly. You need to add some pixals to both of these figures. Just type over these numbers, adding 40 to both ( an arbitrary figure ). Preview the changes before you save them, there is always a chance of unpredictable side-effects, but I think this is a simple fix. If you don't like the way it looks, go back and adjust both figures equally ( adding 30px to both will increase the size slightly less than adding 40px to both ).

  • /* Outer-Wrapper
    ----------------------------------------------- */
    #outer-wrapper {
    width: 660px;
    margin:0 auto;
    padding:10px;
    text-align:left;
    font: normal normal 100% Georgia, Serif;
    }#main-wrapper {
    width: 410px;
    float: left;
    word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
    overflow: hidden; /* fix for long non-text content breaking IE sidebar float */
    }#sidebar-wrapper {
    width: 220px;
    float: right;
    word-wrap: break-word; /* fix for long text breaking sidebar float in IE */
    overflow: hidden; /* fix for long non-text content breaking IE sidebar float */

If this doesn't work, just click on 'clear edits' at the bottom of the module. All will be well. Actually, you should create a back-up of you css code for emergencies. You can do that by clicking on the 'download full template' button at the top of the edit html page. All will be well.

No comments: