Remove large gap in between content in sidebar

  • Author
  • #1037378


    There is a large gap in between content on my sidebar, I think due to the CSS formatting and the lenght of some lines of text (forcing them to a point below neighboring content), I cannot seem to get the text and content to display in a continuous block.

    The blog I need help with is


    Before making any changes, I noticed your single posts are displaying at a width of 50px. Here is an example:

    That is happening because of this CSS rule:

    .widecolumn {
    	padding:10px 0 80px;
    	margin:5px 0 0 5px;

    That looks like a typo in the width value. If you remove the “width:50px;” part, it should go back to normal.

    Next, this rule in your custom CSS is setting the width, margins, and padding for the main content area on your home page:

    .narrowcolumn {
    	padding:0 0 20px 90px;
    	margin:0 30px;

    Try removing that and adding this instead:

    #sidebar {
    	float: left;
    	overflow: hidden;
    .narrowcolumn {
    	width: 520px;
    	margin: 0;
    	padding: 0 20px 0 0;
    #footer {
    	clear: both;

    What this does is make the sidebar float left so the content area and sidebar won’t bump into each other as much, then it sets the content area width to 520px and takes away most of the margin and padding so you can just set a proper width for it and move it around easily.

    Once you save changes, make sure to check all your other pages to make sure they’re being displayed properly.



    Thanks for the help!

The topic ‘Remove large gap in between content in sidebar’ is closed to new replies.