Whats wrong with my CSS? Works in Firefox but not IE [Archive]

Arien

07-17-2005, 08:56 PM

Hi There,

While developing my latest website i decided i'd use a fair bit of CSS for some floating tables.

http://www.hydrofish.com/cms/

Works absolutely fine in Firefox.. but to my horror Internet Explorer takes my site and rips it to shreads!

Can someone take a look at the CSS in the source and the problem area is the <divs> near the top.

I can't work out how to fix it so it looks fine in both browsers

Regards,
Rob

BigBison

07-18-2005, 12:03 AM

Honestly, that shouldn't work in any browser. It looks nice when it does, though! That <style> section belongs within the <head> section, not after it.

The best way to generate cross-browser compliant code is to learn how to use a validator to check your work. The following section illustrates a major problem:

<tr><td id="links_l">MP3Car</td><td id="links_r">- CarPC Forum</td></tr>
<tr><td id="links_l">DigitalCar</td><td id="links_r">- UK CarPC Forum</td></tr>
<tr><td id="links_l">StevieG</td><td id="links_r">- Excellent CarPC</td></tr>
<tr><td id="links_l">LinITX</td><td id="links_r">- UK CarPC Store</td></tr>
<tr><td id="links_l">Mini-ITX</td><td id="links_r">- UK MiniITX Store</td></tr>

An ID must be unique within a document. You can't have multiple id="links_l" attributes. If you need to re-use a style, then set a class for it, like class="links_l". Don't forget to change the style rule from #links_l to .links_l to indicate a class.

I would also recommend renaming your styles, words like "left" and "float" are reserved words which shouldn't be used as class or id descriptors. Also, get rid of those font tags, you're using CSS so try setting those fonts with a style.