Thanks for the feedback guys!
Red and black are the local school colors, thus the red page background. I agree, it is a bit loud…I will look into an alternative.
As for the IE vs. Firefox (and any other browser out there), I wrestled a ton with the way IE mishandles content in floating elements in CSS. This is as close as I could get without sacraficing content, style design, or versatility. If you find a lack of content (white space) as the page loads, and after reloading it is not there, but pushed below the left or right column when in IE, you are experiencing this well-known fault in IE. Admittedly, I am not an IE fan, and prefer Firefox or Opera. However, the vast majority of folks use IE when browsing.
I wrote up the following in my online weather journal (http://lakevilleweather.com/blog/) about the design issues:
[i]
In creating the three-column layout for the home page, and dual column layout for the content pages, we ran into the infamous Internet Explorer (IE) bugs in the way floating elements are handled. Our new design is CSS-based xhtml (currently under review and checking for validation purposes…watch for the validation logo coming soon!) Each element of design is “powered” by Movable Type’s (our publishing platform) ability to pull in separate modules or files to a template page for display construction. For example, the left menu is a module, as is the footer, the masthead, and any element that is repeated on each page of content. This allows us to have the ability to make a change to one module, and therefore change content on multiple pages at once.
Placing the modules on the page is easy, as is alignment and float syntax in CSS. However, IE does not like to obey the syntax. Since 60% of our viewers access lakevilleweather.com via IE, we had to make some compromises. In order for the content to all “fit” on the pages, many of the graphics had to be shrunken down from standard size (640x480), otherwise IE would float the right column to the bottom of the page where it can have the full page width to display content. This brings up page size/resolution. Our stats show that the most common screen resolution used by viewers is 1024x768 at 63%. All other screen sizes and resolutions shared less than 10% commonality, so we aimed for a viewable area that incorporates the browser viewable area and a “sidebar program” like AIM that people commonly have open at the same time. This limited our browser viewable area to around 800-850px width-wise. As a result our format (column-wise) goes 200 : 400 : 200, or 200 : 600, depending on 3- or 2- column layout. Since IE takes screen resolution into account in displaying elements on a page, it forces the floats to break position rules so each element can be viewed in its entirely with a vertical scroll. Blah!
The bottom line is this: lakevilleweather.com is best viewed at 1024x768 in Firefox, Opera, Safari, Mozilla, or just about any browser except Internet Explorer. However, if you use IE at this resolution, you will see content in proper layout. If you view us at a smaller resolution in IE, the layout will be broken. Our website was built for Firefox/Mozilla code standards.[/i]
Kris