Hi Everyone,
I hope you are all well.
Sorry about the long post, just trying to add as much detail as
possible.
I have finally decided to bite the bullet and stop laying out with
tables and now I am struggling to get a layout CSS correct.
I am trying to achieve the following...
--------------------------------------------------------
Header
3 columns...
- Column 1 - flexible
- Row
- column (50%)
- column (50%)
- Column 2 - fixed width (202 px + 4px padding + 1px left border)
- Column 3 - fixed width (120px + 4px padding + 1px left border)
Footer
--------------------------------------------------------
To get this to work I have set it up as the following...
--------------------------------------------------------
Header
2 columns...
- Column 1 - flexible
- Row
- column (50%)
- column (50%)
- Column 2 - fixed width (340 px + 1px left border)
- column (202 px + 4px padding)
- column (120px + 4px padding + 1px left border)
Footer
--------------------------------------------------------
You can see the examples here :
http://www.itsecureportal.com/layout/example13.html and here
http://www.itsecureportal.com/layout/example18.html
Ok, the problem...
Example 13 works fine (for me) in Firefox and Opera but not in IE6 -
this has the markup the wrong way round (eg Column 1 comes after column
2 in the markup)
Example 18 doesn't work in anything - this has the markup the correct
way round (eg Column 1 comes before Column 2 in the markup)
Ideally, I'd like to keep the markup in the correct order, but I guess
it's not too much of an issue if the site works.
The CSS and HTML validates properly in both cases (it exactly the same,
but in a different order)
Can anyone advise me as to why Example 13 wouldn't work in IE and why
Example 18 wouldn't work at all? I'd be very grateful for any advise at
all. I have reviewed loads of sites from google etc but nothing quite
hits the mark.
I've been pulling my hair out over this for the past few days.
Many thanks in advance.
(A slightly more balding) - John
______________________________________________________________________
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
