Why do browsers render things differently? How to correct for this?

[Gerry]

Take a look at myr (.) info.

using firefox and IE7, the site renders correctly with every thing in the formatting line up center.

However, in Google Chrome, Opera, and Safari everything is aligned left which really screws up the site.

Is there a snippet of code I can add or correct somewhere in the template (Joomla based)?

 

[Tia Wood]

Actually, when you view it in a higher resolution it does it in IE7 / IE8.

I can't track down which element is doing that but add this to css:

#the_wrapper {
width: 979px;
margin-left: auto;
margin-right: auto;
}

Then in the index.php of the template file, look for:

<br clear="all" /></div>
<div id="leftcolumn">

And add <div id="the_wrapper"> like this:

<br clear="all" /></div>
<div id="the_wrapper">
<div id="leftcolumn">

Then look for:

<br clear="all" />
</div>
<div id="f_area">

And add a </div> before <br clear="all" /> like this:

</div>
<br clear="all" />
</div>
<div id="f_area">

PM me if you need help.

 

[Gerry]

Actually, when you view it in a higher resolution it does it in IE7 / IE8.

PM me if you need help.

Damn, had no idea it would render that way in higher res.

Thanks for the help offer but I will give it a go with your instructions.

Thanks!

 

[Gerry]

Thanks!

Got the alignment issue resolved.

After all your recommendations were added, it still was out of kilter.

I looked and saw that I was trying to "force" a google adsense bar in the header position that really screwed the whole thing up.

Once I disabled that ad, we're back on track!