PDA

View Full Version : I'm in 3 Column CSS Hell - help!



pridmorej
12-18-2007, 01:48 AM
Hi All,

Sorry to cry for help on my first post, but I'm pulling my hair out over this one - it should be easy!

Background:
I'm using a three column layout with multiple Divs running down the left and right columns.

However, I need to offer the ability for the multiple divs to be either on the left or right depending upon a custom stylesheet that is applied dynamically, therefore I cannot wrap the multiple divs in a "left" div and "right" div - that would be too easy.

Problem:
The CSS works fine in IE, but in FF the right hand divs drop down to be level with the left div that was defined prior in the html.

http://www.funeralwishes.co.uk/images/layoutff.gif

Question:
How can I make all the divs align to the top as follows in FF?

http://www.funeralwishes.co.uk/images/layoutie.gif

I thought of posting a stripped out version of my code, but that would have taken too long, so I tried modifying the sample code "stu nicholls | CSS PLaY | three column layout | simplest version possible", but still had no luck getting it to do what I can.

The Code:
Is located in the file here: http://www.funeralwishes.co.uk/test.cfm - don't forget to open in FF to see the problem ;)

The Plea:
I never had this problem when the site was laid out using tables, but since changing to CSS layout all hell has broken loose :(. I hope someone can help. I look forward to your responses.

Peace and respect.

Jeremy.

boogyman
12-18-2007, 02:07 PM
your margins are causing the problem. Generally I allow for a 5% gap between float elements to account for the different renderings between browser models.

Post your URL to the problematic code, so we can help you troubleshoot.
if your site is not live, post the code wrapped in [cod.e][/c.ode] tags (without the dots)

pridmorej
12-18-2007, 06:10 PM
Hi, Thanks for the reply. I'll give adjusting the margins ago tonight.

All the CSS and HTML is included in the test.cfm file above.

Twey
12-18-2007, 08:32 PM
boogyman: hint: try using
instead of dots :)

boogyman
12-18-2007, 09:24 PM
boogyman: hint: try using
instead of dots :)

that had to be something else to type out 3 block code tags in 1 haha, but thanks for the hint :)