WordPress.com is an easy way to start blogging. Get a blog, check out our features, read the latest announcements, choose from great themes, or learn about the team behind it.
Need help? Check out our Support site, then
Hi,
I'm working with Imbalance2. I was able to align the posts on the Home page. But when I visit the site for the first time, they are not aligned. If I click refresh, they are then perfectly aligned. Why is this happening?
Thanks in advance for your help!
The blog I need help with is writingkraft.wordpress.com.
Can you take a screen shot when it is not aligned and upload it to your media library and post the URL so that we can see it? Alternately you could post it at dropbox if you wish.
One thing I see that need corrected, but is not causing the misalignment of the boxes is that in #wrapper in your CSS, add a width declaration at 1000px, which is the width of your header. Right now stuff is hanging outside of the right side of the wrapper which is not a good thing.
#wrapper {
width: 1000px;
}I'm afraid I'm at a little bit of a loss as to what is causing it, and unlike you, refreshing the page is not causing things to align properly for me. It stays misaligned.
I'll tag this to have it moved to the CSS forum since this is likely a CSS related issue and hopefully @designsimply will see it and look into it for you.
Hi,
Thanks so much for the help! The before & after screenshots show the issue on Firefox 12.0. Please note, the screenshots start from the second row of posts. I also show the rollover when a post overlaps the post below it in the misaligned shot.
Misaligned when first visiting site:
http://writingkraft.files.wordpress.com/2012/05/screenshot-misaligned.jpg
Aligned when I refresh (of course, due to # of lines per post, they're not totally aligned but at least closely aligned):
http://writingkraft.files.wordpress.com/2012/05/screenshot-aligned.jpg
In Chrome v18 and Safari v5.1.5, they are pretty much aligned on first visit. IE9 the Home page is totally misaligned before & after refreshing. I am using a PC.
The difference between browsers is happening because not every browser is treating the font size exactly the same way and it's making the title for some of your posts take up more lines in some browsers compared to others and that in turn is making the container height for some posts a little bit taller.
Or at least that's what I think is happening. :)
There isn't a way to make all browsers behave *exactly, exactly* the same way, but a lot of times as web designers we try. In this case, making the titles a little bit smaller might help. Give this a try to see if it does the trick:
designsimply.home .box h1 {
font-size: 16px;
}As a side note, Imbalance 2 is designed to arrange the blocks of posts in the best order based on their size. It's possible to have the order change if the size of the posts change.
This topic has been closed to new replies.
