Giving the secondary column and main column a bit of space.

  • Author
  • #623987


    I tried to move the secondary and primary columns out to their respective sides of the page to space things out a bit (secondary to the left, primary to the right) as they are really too close together and it all feels a bit claustrophobic.

    However I’ve run into a problem in that my images up in the top right of the screen (facebook/twitter links etc) suddenly go haywire when I move the secondary. Any suggestions?

    The blog I need help with is



    I’m sorry but we have only 2 Volunteers who occasionally help with CSS editing. They both have jobs and you will have to be patient while witing for them to log-in, find, this thread and help you.

    That being said do note that there is a navigation bar at the top of all blogs. I believe it’s 22 pixels in height but I could be wrong. Perhaps you haven’t allowed for it in your CSS editing or perhaps your problem is stemming from something else, but I thought I’d best mention it.



    Try adding this to your #content selector:

    border: solid 1px #f00;
    overflow: hidden;
    clear: both;

    Those properties should allow you to move around your columns without affecting other elements (outside the #content element).

    Also, I’d recommend you to not use “em” units for flexible margins or paddings; use “%” instead.

    Since there’s not container element in your markup, this is just taking space… go ahead and delete it.

    #container {


    thanks for the response devblog. I did what you said and then added this to secondary:

    ( ` )#secondary {
    padding:15px 10px 15px 20px;
    }( ` )

    But annoyingly the 4 images from the top right still go down with it.



    without the ( ` ) marks, sorry that was me trying to put the code in blockquote

The topic ‘Giving the secondary column and main column a bit of space.’ is closed to new replies.