SitePoint Sponsor

User Tag List

Results 1 to 4 of 4
  1. #1
    SitePoint Member
    Join Date
    Sep 2013
    Posts
    2
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Issue with Blogger Template

    Hello everyone.

    My blog is:
    http://zoiik.blogspot.com

    So I am attempting to set up a site through Blogger and up until today everything was going great. The custom template I had chosen was working fine, until suddenly it wasn't. The template shows summaries of the blog posts in two columns, with two posts per row. But now it is showing all the summaries in a single column, leaving lots of blank space. Also, a drop down menu of my categories/labels is now displaced.

    I thought I had made some sort of mistake with widgets, so I deleted the most recent ones I had added, which did not help the issue. Unfortunately, my knowledge of html/css is very limited so I don't know where in the code to start looking for the issue.

    Any help would be very much appreciated.

  2. #2
    It's all Geek to me silver trophybronze trophy
    ralph.m's Avatar
    Join Date
    Mar 2009
    Location
    Melbourne, AU
    Posts
    23,598
    Mentioned
    411 Post(s)
    Tagged
    6 Thread(s)
    Hi Zoykii. Welcome to the forums.

    Your .post boxes are too wide, because padding and margin are added to the overall width. One option is to reduce the width from 280px to around 264px (line 245f):

    Code:
    .post {
    margin: 0 13px 10px 0;
    padding: 10px;
    width: 264px;
    height: 250px;
    float: left;
    positon: relative;
    overflow: hidden;
    }
    To fix the drop menu positioning, you could remove the margins from the parent element by adding this to your style sheet:

    Code:
    #labelsmenu {margin: 0;}
    That overrides this culprit:

    Code:
    .section {
    margin: 0 15px;
    }
    ... which you may or may not need elsewhere, though I suspect you might.

  3. #3
    The CSS Clinic is open silver trophybronze trophy
    Paul O'B's Avatar
    Join Date
    Jan 2003
    Location
    Hampshire UK
    Posts
    39,803
    Mentioned
    158 Post(s)
    Tagged
    4 Thread(s)
    Hi, Your posts are too wide to fit in the space you have allocated.

    You will either have to shorten the posts.

    e.g.
    Code:
    .post {
        width: 265px;
    }
    Or work your way up the parents in that section and remove padding/margins etc. It looks as though if you remove the margin from .section then the original elements will fit but I don't know what impact that may have site wide if you are using that class elsewhere.

    Code:
    .section{ 
       margin: 0;
    }

  4. #4
    SitePoint Member
    Join Date
    Sep 2013
    Posts
    2
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thanks for the quick reply.

    I figured something like that was happening. Not sure why everything was working before and not now.

    I applied the changes you suggested and it worked perfectly. =)

    Thanks a lot.


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •