468,135 Members | 1,483 Online
Bytes | Developer Community
New Post

Home Posts Topics Members FAQ

Post your question to a community of 468,135 developers. It's quick & easy.

Problems with 3 column fluid layout - 3rd column wraps

I want a page with a centered div containing two rows. Top row has an
image and some text. The bottom row needs to have three columns. I'd
love to have the 1st column set to a fixed width then have the 2nd and
3rd columns fill the remaining space but I've given up on that and am
willing to settle for the second row to have a fluid 3-column layout
(or something else simple).

Anyway, I've developed a page where the second row has this 3 column
fluid layout. This is working great for me in IE6, but in IE7, the 3rd
column wraps down as the browser page is narrowed. Is there any way to
fix this problem?

Here's the sample page: http://www.geocities.com/charles_lof...rapsinIE7.html
NOTE - because geosites address an element down the right hand side
you will not see the third column wrap here - you'll have to pull the
source, save it somewhere, then open it in IE7 to see the problem.

FYI, the page is valid CSS and HTML (all validation errors are all
produced by code automatically added by geosites, i.e. out of my
control.)

Your input appreciated.
Mar 26 '08 #1
3 3387
In article
<e4**********************************@m34g2000hsc. googlegroups.com>,
hzgt9b <ce******@gmail.comwrote:
I want a page with a centered div containing two rows. Top row has an
image and some text. The bottom row needs to have three columns. I'd
love to have the 1st column set to a fixed width then have the 2nd and
3rd columns fill the remaining space but I've given up on that and am
willing to settle for the second row to have a fluid 3-column layout
(or something else simple).

Anyway, I've developed a page where the second row has this 3 column
fluid layout. This is working great for me in IE6, but in IE7, the 3rd
column wraps down as the browser page is narrowed. Is there any way to
fix this problem?

Here's the sample page:
http://www.geocities.com/charles_lof...rapsinIE7.html
I'm looking at your page in Firefox, and I don't see three columns
anywhere, or any evidence of wrapping. I do, however, see a very
ugly background image in the box containing the "Lorel, Ipselium !"
and the Lorel link. Ugly, because it's been stretched horizontally.
NOTE - because geosites address an element down the right hand side
you will not see the third column wrap here - you'll have to pull the
source, save it somewhere, then open it in IE7 to see the problem.

FYI, the page is valid CSS and HTML (all validation errors are all
produced by code automatically added by geosites, i.e. out of my
control.)
Are you sure? You can upload the file of your page to the W3C
validator, just to make sure that ALL the errors are Geocities'
responsibility, as currently:

"This page is not Valid XHTML 1.0 Transitional!"

- might be a problem!

<http://validator.w3.org/check?uri=ht...es.com%2Fcharl
es_loftis%2F3rdcolwrapsinIE7.html&charset=%28detec t+automatically%29&doct
ype=Inline&group=0>
>
Your input appreciated.
Mar 26 '08 #2
On Mar 26, 1:36*pm, David Stone <no.em...@domain.invalidwrote:
In article
<e497b3a9-cb6a-4c93-a9c3-599ba1ae6...@m34g2000hsc.googlegroups.com>,

*hzgt9b <celof...@gmail.comwrote:
I want a page with a centered div containing two rows. Top row has an
image and some text. The bottom row needs to have three columns. I'd
love to have the 1st column set to a fixed width then have the 2nd and
3rd columns fill the remaining space but I've given up on that and am
willing to settle for the second row to have a fluid 3-column layout
(or something else simple).
Anyway, I've developed a page where the second row has this 3 column
fluid layout. This is working great for me in IE6, but in IE7, the 3rd
column wraps down as the browser page is narrowed. Is there any way to
fix this problem?
Here's the sample page:
http://www.geocities.com/charles_lof...rapsinIE7.html

I'm looking at your page in Firefox, and I don't see three columns
anywhere, or any evidence of wrapping. *I do, however, see a very
ugly background image in the box containing the "Lorel, Ipselium !"
and the Lorel link. *Ugly, because it's been stretched horizontally.
NOTE - because geosites address an element down the right hand side
you will not see the third column wrap here - you'll have to pull the
source, save it somewhere, then open it in IE7 to see the problem.
FYI, the page is valid CSS and HTML (all validation errors are all
produced by code automatically added by geosites, i.e. out of my
control.)

Are you sure? *You can upload the file of your page to the W3C
validator, just to make sure that ALL the errors are Geocities'
responsibility, as currently:

"This page is not Valid XHTML 1.0 Transitional!"

*- might be a problem!

<http://validator.w3.org/check?uri=ht...es.com%2Fcharl
es_loftis%2F3rdcolwrapsinIE7.html&charset=%28detec t+automatically%29&doct
ype=Inline&group=0>


Your input appreciated.- Hide quoted text -

- Show quoted text -
David thanks for the quick reply.
Try opening the page in IE6 or IE7. This page is only being targeted
for IE - I haven't tested it in browsers other than IE6, IE7.
Yes, I re-verified that all the HTML validation errors are caused by
Geosites tack on code.

So, can you suggest a cross-browser, fluid 3-column layout?
Mar 26 '08 #3
hzgt9b wrote:
David thanks for the quick reply.
Try opening the page in IE6 or IE7. This page is only being targeted
for IE
If you are targeting IE why are you trying to use XHTML? If you were
successful in doing it correctly you will disenfranchise IE all together.
- I haven't tested it in browsers other than IE6, IE7.
Yes, I re-verified that all the HTML validation errors are caused by
Geosites tack on code.
No not all, XHTML is not just HTML with "<br />" elements

--
Take care,

Jonathan
-------------------
LITTLE WORKS STUDIO
http://www.LittleWorksStudio.com
Mar 26 '08 #4

This discussion thread is closed

Replies have been disabled for this discussion.

Similar topics

3 posts views Thread by Doug McCrae | last post: by
22 posts views Thread by Jam Pa | last post: by
40 posts views Thread by Mark | last post: by
9 posts views Thread by TristaSD | last post: by
3 posts views Thread by Mark | last post: by
27 posts views Thread by didacticone | last post: by
1 post views Thread by gcdp | last post: by
By using this site, you agree to our Privacy Policy and Terms of Use.