0

I have a table with table-layout set to fixed. In the first row I have a td with text inside. It's something like: 

<table>
    <tbody>
        <tr>
            <td colspan="2" style=" min-width: 250px; width: 100%;">
                <b>Vendor/Firm Information</b>
            </td>
        </tr>
        <tr>
            some content
        </tr>
        ... and so on
    </tbody>
</table>

So, the width of the first row is actually less than 250px. It's even less than content. So, I need to know: is there any reason for that? Is there something that don't allow the table cell to take appropriate width?

I use old version of Chrome (22.0.1229.0) and I think that it's rather a bug than incorrect styles.

In latest Chrome everything is alright.

cassandrad
  • 3,412
  • 26
  • 50
  • why does the bold tag have a min-width? – Derek Story Jan 16 '15 at 17:49
  • @dwreck08 I can remove it. Will this action change something? – cassandrad Jan 16 '15 at 17:50
  • I'm not sure what you are asking. The width of the td is set to "250px" (it's min width) because the content isn't longer than 250px. See http://jsfiddle.net/z6t7ug3a/1/ (the blue is showing the full width) – Derek Story Jan 16 '15 at 17:52
  • @dwreck08 yes, you're right. But in my version of chrome, such example would be 9 or 11 pixels even with min-width 250px. I need to know is there something else that affects width of td. I mean, in css or browser-specific. – cassandrad Jan 16 '15 at 17:58

2 Answers2

0

I think that colspan="2" there is the reason.

There is no reasonable way to split that min-width between two spanned columns. So min-width constraint just get ignored on spanned cells.

c-smile
  • 26,734
  • 7
  • 59
  • 86
  • min-width works with colspan. For instance, if there are two td's with a 50% width in the row beneath: http://jsfiddle.net/z6t7ug3a/2/ – Derek Story Jan 16 '15 at 17:59
  • I guess not. In latest version of chrome also in ie11 all works fine. But I will try to remove it. Also, when I set width manually on td, all works fine too. – cassandrad Jan 16 '15 at 17:59
0

Please see the response here:

Chrome, Safari ignoring max-width in table

The gist is that "max-width" only applies to block elements. So setting the table to "display: block;" should resolve the issue.

Community
  • 1
  • 1
citizenen
  • 703
  • 6
  • 24
  • I was aware that some browsers does not apply `max-width` to table tag itself. But I need to apply property to `td`, not `table`. – cassandrad Jan 19 '15 at 09:53