html - table cell width issue

Question

Ask a Question

Welcome To Ask or Share your Answers For Others

html - table cell width issue

asked Oct 24, 2021 in Technique[技术] by 深蓝 (71.8m points)

I have a table with 2 rows where i need varying cell width as

<body bgcolor="#14B3D9">
<table width="100%" border="1" bgcolor="#ffffff">
    <tr>
        <td width="25%">25</td>
        <td width="50%">50</td>
        <td width="25%">25</td>
    </tr>
    <tr>
        <td width="50%">50</td>
        <td width="30%">30</td>
        <td width="20%">20</td>
    </tr>
</table>
</body>

I cannot get the width as specified the second row also gets the width of the first row.

See Question&Answers more detail:os

与恶龙缠斗过久,自身亦成为恶龙；凝视深渊过久,深渊将回以凝视…

285 views

1 Answer

深蓝 · Answer 1 · 2021-10-23T17:53:41+0000

to do this with one table you need to introduce more columns and then get the column widths by using colspan so you can get the combined widths you require

to get this to work well across browser you will possibly need to use the <col> and <colgroup> elements : http://www.w3.org/TR/html401/struct/tables.html#h-11.2.4

<body bgcolor="#14B3D9">
<table width="100%" border="1" bgcolor="#ffffff">
<colgroup>
<col width="25%">
<col width="25%">
<col width="25%">
<col width="5%">
<col width="20%">
</colgroup>

    <tr>
        <td>25</td>
        <td colspan="2">50</td>
        <td colspan="2">25</td>     
    </tr>
    <tr>
        <td colspan="2">50</td>
        <td colspan="2">30</td>
        <td>20</td>
    </tr>
</table>
</body>

Categories

html - table cell width issue

Please log in or register to add a comment.

Please log in or register to answer this question.

1 Answer

Please log in or register to add a comment.

Just Browsing Browsing

Most popular tags