There must be an easier way? - CSS, Browser compatibility

jodes · 12-09-2005, 07:18 PM

Hi,

I've been trying to be a good programmer and try to get to grips with CSS. What I thought I could code efficiently (being a simple page) has quickly become a mess. Not to mention, I'm now out of ideas as to how to actually get it to look how I want, nevermind good coding!

http://blueperfection.co.uk

The div with the excessively large black border is the problem - in firefox anyway. For some reason, it's not doing the same thing as the other similar divs.

I 'd really appreciate some good advice here! I'm sure there must be a much easier way?

Cheers

_Aerospace_Eng_ · 12-09-2005, 07:28 PM

What is up with the negative positioning? I don't think thats needed. Let the page flow together. Use floats when necessary, don't use absolute positioning if possible. Use margin and padding to position elements instead rather than top and left properties. What exactly is th div supposed to be doing?

pixelEngine · 12-09-2005, 07:49 PM

Also try to use your images as backgrounds as much as possible via css, and then perhaps a image replacment technique.... many to choose from.

Also you could benefit from a bit of image optimization i think.

good luck.

jodes · 12-10-2005, 05:10 PM

Wow thanks for your quick replies!! Since I didn't know myself what half the code was for anymore - I've scrapped all the css, and many divs to make a fresh start.

The problem started since I was using floats on the images in order to get them next to each other, which wasn't working. Now, instead, I've put display:block on them and now they're flush against each other :-)

Thanks for the advice!

jodes · 12-10-2005, 06:55 PM

Hi again,

I've come accross some problems - namely nested floats in firefox.

I've tried some minor mods to get it working in firefox including floating the container of the inner floats, but it still only works in IE.

Any ideas?
Jodes

jodes · 12-11-2005, 03:05 AM

I've now discovered, for anyone else with this problem as well perhaps, that by isolating the inner divs inside a table with one cell, rather than a div, prevents the inner clears affecting the outer float. If theres another answer to this I'd love to know?