Posts Skewed to the right on home page

  • On the home page of my website https://www.brandasy.com, all the posts below the latest post are skewed to the right, messing up the layout of the right side.

    However, if you visit the individual pages of the posts, everything seems to be in order. What can be causing this problem?

    The culprit seems to be the last post because the moment I change its status to private, the layout becomes normal once again. But why?

    Is it because I’ve posted pictures in it? But then I’ve posted pictures of exactly the same size in the post previous to it as well and yet it doesn’t mess up the theme.

    And no I haven’t changed the formatting or added any CSS class for this post.

    How can I ‘unmess’ the layout without deleting the post causing it?

Viewing 5 replies - 1 through 5 (of 5 total)

  • The problem is in your style.css line 458

    .center-widget {
  -moz-background-clip:border;
  -moz-background-inline-policy:continuous;
  -moz-background-origin:padding;
  background:transparent url(images/center_widget_bottom_bg.gif)     no-repeat scroll center bottom;
  color:#555555;
  font-size:10pt;
  margin:0 210px 6px;
  padding:0.1em 1.2em 0.6em;
}

    The class center-widget is been applied twice sequentially on the markup, and is adding a huge margin to the posts:

    margin:0 210px 6px;

    MAC ??

    Thread Starter saqib62

    (@saqib62)

    Thank you for taking the time out to not only look into my problem but offer a solution as well. Really appreciate it.

    I’ve implemented your proposed solution in my CSS but the problem persists.

    What more can I do about it?

    Thanks in advance.

    In your file style.css line 458, you are defining the class .center-widget, and giving it a left/right margin of 210px. Nothing wrong so far.

    Then in your markup you have your posts inside a “mother” DIV with the .center-widget class applied. Still nothing terribly wrong here.

    But, here is where you go wrong:

    Inside that “mother” DIV you have your individual posts inside DIVs, on wich you are also appling the same .center-widget class, causing the skew.

    The posts are only behaving how you are telling them to behave:
    -They are assuming a 210 left/right margin inside the “mother” DIV wich is already been applied the same margin (a+a=2a)

    Just remove the class on your individual posts and see the result.

    Try it!

    MAC ??

    Thread Starter saqib62

    (@saqib62)

    I have removed the following from my style.css file

    .center-widget-title {
	 background:url("images/center_widget_bg.gif") center top no-repeat;
	 color:#0066cc;
	 font-size:16px;
	 font-weight: bold;
	 margin:0px 210px 0px;
	 padding:8px 0px 0px 15px;
	 }

    But as you can see on my website, the problem still remains. Sorry to bother you once again, but what more can I try to resolve this issue?

    Thanks in advance.

    You’re missing a closing div tag, right after this text:

    It may have announced its entry into the Pakistani market now…

    Also, have a look here

    Peter

Viewing 5 replies - 1 through 5 (of 5 total)
  • The topic ‘Posts Skewed to the right on home page’ is closed to new replies.