firefox table wrapping problem

[CRON]

Hi anyone come across something like this before:
http://www.scouttalk.ie/unit.php?orgID=3

look at the member list at the bottom of the page. In IE these images
wrap beautifully to the next line but in firefox they overlap eachother
to fit in the cell.

I have each image inside a table with style: float:left. This wraps
the tables so that they appear side by side. I cant figure out the
problem. I've tried word-wrap:break-word and overflow:auto on the
parent cell but they have no effect.

I know you think I should have take the pics out of the tables but I
need them in there because when you sign into the site, it shows user
names beneath each image ;c)

Any help would be a dream!
Ciaran

 

[CRON]

This is probably a better example of the problem: view in IE then in
firefox
http://www.scouttalk.ie/search.php

 

[jojo]

Hi anyone come across something like this before:
http://www.scouttalk.ie/unit.php?orgID=3

look at the member list at the bottom of the page. In IE these images
wrap beautifully to the next line but in firefox they overlap eachother
to fit in the cell.

And they need two lines in IE but try to fit in one in FF. Perhaps thats
the problem? Try to specify a width for the tables so FF has to break
them into a second line. Can use min-width here, it's ignored in IE so
it shouldn't cause new problems.

I have each image inside a table with style: float:left. This wraps
the tables so that they appear side by side. I cant figure out the
problem. I've tried word-wrap:break-word

Not a good idea to use a IE-only property to fix a problem in FF... ;-)

and overflow:auto on the parent cell but they have no effect.

Can use overflow:hidden on the cells, the images shouldn't overlap then,
but they aren't shown completely anymore.

<snip>

HTH, jojo

 

[CRON]

And they need two lines in IE but try to fit in one in FF. Perhaps thats
the problem? Try to specify a width for the tables so FF has to break
them into a second line. Can use min-width here, it's ignored in IE so
it shouldn't cause new problems.

Yeah the idea is that the pics wrap to the next line at the moment its
2 but it could be 3 or more in future.
I tried specifying the tables width but got nothing.

Not a good idea to use a IE-only property to fix a problem in FF... ;-)

I was really just trying anything I could think of - didnt realise!

Can use overflow:hidden on the cells, the images shouldn't overlap then,
but they aren't shown completely anymore.

Yeah overflow:hidden hides the pics behind the next cell which is
strange because no other overflow functions have any effect.

<snip>

HTH, jojo

Thanks for the reply I appreciate your help a lot
Ciaran

 

[jojo]

CRON wrote:

Yeah overflow:hidden hides the pics behind the next cell which is
strange because no other overflow functions have any effect.

Visible: just the thing you do not want... and default with everything
but the body, textareas, inputs and frames, so it cannot change anything

Auto: let the browser decide => it uses the default value => visible

But scroll should have an effect, shouldn't it?

 

[Andy Mabbett]

Hi anyone come across something like this before: http://www.scouttalk.
ie/unit.php?orgID=3

Failed validation, 95 errors

http://validator.w3.org/check?verbose=1&uri=http://www.scouttalk.ie/unit.php?orgID=3

(aka http://tinyurl.com/kh2lp )

 

[Chris F.A. Johnson]

Hi anyone come across something like this before:
http://www.scouttalk.ie/unit.php?orgID=3

look at the member list at the bottom of the page. In IE these images
wrap beautifully to the next line but in firefox they overlap eachother
to fit in the cell.

I have each image inside a table with style: float:left. This wraps
the tables so that they appear side by side. I cant figure out the
problem. I've tried word-wrap:break-word and overflow:auto on the
parent cell but they have no effect.

I know you think I should have take the pics out of the tables but I
need them in there because when you sign into the site, it shows user
names beneath each image ;c)

I put each image in a separate table, and used "display:inline"
for this page:
<http://torquiz.freeshell.org/current/qa-04.04.shtml>.

It works in IE and FF, but not Konqueror and Opera. They continue
to use display:block.

 

[CRON]

But scroll should have an effect, shouldn't it?

Aye I thought it should but for some reason it doesnt. Perhaps there is
a better way to lay it out but I can't think of anything but tables as
a way to display images and corresponding pics lik that across the
page. It's so frustrating when it works in one browser but not in
another!

 

[CRON]

I put each image in a separate table, and used "display:inline"
for this page:
<http://torquiz.freeshell.org/current/qa-04.04.shtml>.

It works in IE and FF, but not Konqueror and Opera. They continue
to use display:block.

Brilliant! Thanks a million Chris! I really appreciate you stopping by!
;c)
Cheers to you too jojo!
To Andy Mabbett I say this:

Failed validation, 14 errors .
http://validator.w3.org/check?uri=h...etect+automatically)&doctype=Inline&verbose=1

Cheers,
Ciaran

 

[Jim Moe]

http://www.scouttalk.ie/unit.php?orgID=3

look at the member list at the bottom of the page. In IE these images
wrap beautifully to the next line but in firefox they overlap eachother
to fit in the cell.

Sheesh! What a massive misuse of tables.
Useful tip: If there is a difference in layout between IE and other
browsers, IE is incorrect. This is true for almost all cases.

<img>s are inline elements. They follow similar rules as text. Get rid
of all the table markup, put the images altogether and they will wrap
naturally.
For the images with captions see
<http://www.spartanicus.utvinternet.ie/centered_image_gallery_with_captions.htm>.

 

[Andy Mabbett]

To Andy Mabbett I say this:

Failed validation, 14 errors .
http://validator.w3.org/check?uri=http://groups.google.ie/group
%2Falt.html%2Fbrowse_frm%2Fthread%2Fb012b2b13182e4b0%2Fa2e24fe23b049ca2
%3F&charset=%28detect+automatically%29&doctype=Inline&verbose=1

Yes. So?

 

[CRON]

of all the table markup, put the images altogether and they will wrap
naturally.
For the images with captions see
<http://www.spartanicus.utvinternet.ie/centered_image_gallery_with_captions.htm>.

This is cool - never seen it before. Thanks for the tip. I just go with
whatever works and tables were all I could think of. I'm sorry if I
offended you! ;c)

 

[Jim Moe]

This is cool - never seen it before. Thanks for the tip. I just go with
whatever works and tables were all I could think of.

"If the only tool you have is a hammer, everything looks like a nail."