Hi I am having trouble with the width of a table in firefox 2. When i try to set the width of the whole table or just a column it does not work. It even overflows over the div it is in. The problem is that it is not wrapping the text in one of the columns. How do i fix this?

Sorry i have no example

8 Years
Discussion Span
Last Post by jonow

Here's some sample:

<div style="margin : 0 auto padding : 0; width : auto; overflow : hidden;">
<table style="border : none; border-collapse : collapse; width : 100%; height : auto; min-height : 30px;">
<td style="width : 30%; padding : .500em;">30% Width</td>
<td style="width : 70%; padding : .500em;">70% Width</td></tr>

I tried that and it did not work. My problem is that i have 4 columns and in one of them there are urls in a bunch of different rows. (all the same column) and Firefox 2 will not wrap the text because there are no spaces in between words because they are urls. I can fix it by putting spaces in the urls but i rather not. Is there a solution to this?


URLs will not wrap, and should not be wrapped. Consider the following:

- Use br tags in the url where you want to break it (do this on the text part of the a tag, not the url part)

- Shorter urls? Can you avoid displaying the part that controls a script in the test part?

- Redesign the columns. Can the url take up an entire row below the other information (using rowspan)?

- Change the font size (if the trouble is minor)

- Can you wrap something else so the url fits?

Note that divs do not like to be in the same structure a table is in. There are known bugs when they are intermixed.



Firefox and IE behave differently when a table will not fit in the allocated space:

- Firefox makes the table wide enough to hold the content if it can't wrap the cell contents. This will even make the page wider if necessary, adding horizontal scrollbars if it is wider than the browser windows.

- IE will sacrifice the contents of the cells before it will make the table larger. But if table cells contain images, it will do the same thing that Firefox does.

Note that, when an object will not render in the allocated space, there are no standards telling a browser how to render it. So each browser has its own defaults.


The only solution which would work with my situation is put the <br> tags, which i have already done.

Thank you for your help.

This question has already been answered. Start a new discussion instead.
Have something to contribute to this discussion? Please be thoughtful, detailed and courteous, and be sure to adhere to our posting rules.