Can anyone suggest a fix for this please?
I changed three of my blogs to a three column template using a hack by a guy called Thur. I use Firefox but today I went to check the Adsense Preview Tool (which is in IE) and found that the 3 columns don't fit on the screen and two of them are being shown below the first!!

Hi Flora,

Those templates you see on the left, middle and right are inside div tags.

One reason why they get pushed down like that could be because the width of one or two div tags is greater than the others.

Firefox has this cool extension called MeasureIt, it allows one to measure the width of components on your web page. After you install the MeasureIt extension, you can measure the *original* width of those components.

My first guess is that the width of AdSense ads you are using is wider than the width of the original div tags provided by blogger.

So, after getting the original width compare the width with that of AdSense ad formats, and put the largest possible AdSense ad that fits in that space.

Another reason why the div might be forced to be wider is if, you add very long word with no space, for example jdfalfjldkfjadl;fkjdsfkljsflkjdflkafjdlksfdf , if the width of that word exceeds the width of the div then the div tends to become wider.

I personally prefer having my own website to using external blogging services, because I will have full control over the HTML. But the downside of that is that I am fully responsibile for the hosting cost and the revenue it makes.

Hi,

Thanks for your ideas but I still cannot work out why this problem does not show up in firefox, only in internet explorer?

CSS and HTML are browser dependent to some extent.

Certain CSS features that function normaly in Firefox won't work the same way in Internet Explorer and vice versa.

Those are known as CSS browser incompatibility issues.

W3C makes the standards and then distributes it to the browser authors, some browser authors don't follow the standard or simply implement it wrongly resulting in incompatibilites.

So in order to make something work in most common browsers : IE, FF etc one needs to find out what works on both.

Did you try to minimize the width of the AdSense unit by generating a smaller one?

Thanks for your advice, it makes the logic a bit clearer to me. I tried changing the widths at Kevin the Collie, I took all the Adsense and other add-ins to 160 or less. But when I checked the problem is still showing in IE.

I measured the width of the page components, it comes up with

Width of top banner 966 pixels

Width of left navigation 219 pixels

Width of main content 485 pixels

Width of the right nave 220 pixels

The widths look fine, and they should align properly.

Unfortunately, it's a lot of HTML code to look at and fix, do you remember at what point exactly it got mis-aligned like that?

Whatever you wrote or whatever image you added at that time caused it to become misaligned.

Perhaps you could start a new template and add stuff, and watch if it stays that way for long.

This is one reason why I don't like WYSIWYG editors, I like to hand-code everything.

I think if you learn CSS and XHTML, you'll be able to spend your time efficiently in aligning the divs.

Writing clean code from scratch save so much time and headache in the future.

Thanks for your help, in the end I thought about the time it would take to fix and I am now gradually moving my blogs out of Blogger on to my own hosted wordpress templates. Fingers crossed.

As long as you are familiar with (x)html and CSS you can easily control how the page displays. Both are very easy to learn.

Have you reinstaled the firefox , have you tried that ?
Just try this i think it might fix your problem .
Otherwise contact thur !

Thank you - Firefox is fine, I believe it is just a problem with the disply in IE. I have now moved most of my blogs over to Wordpress hosted on my host server, and they have performed incredibly well.