Welcome to OGeek Q&A Community for programmer and developer-Open, Learning and Share
Welcome To Ask or Share your Answers For Others

Categories

0 votes
2.4k views
in Technique[技术] by (71.8m points)

html - Rowspan & Colspan issue when no unique rowspan

With this code

<table border=1 cellpadding="30" height="300" width="100%">
        <tr>
            <td colspan="5" rowspan="3" >
            XXXX</td>
            <td colspan="2" rowspan="3" > 35</td>
        </tr>

        <tr> 
            <td  colspan="6" rowspan="2">
            YYYY</td>
            <td colspan="1" rowspan="2" >34</td>
        </tr>
</table>

I expect this kind of result

enter image description here

And I obtain

result

After long time focusing, I keep been lost.
Any specific point of html standard I miss about colspan / rowspan rules ?

Only way I found, but not acceptable in my app architecture is

<table border=1 cellpadding="10" cellspacing="0" >    
        <tr>
            <td width="0px"></td>
            <td colspan="5" rowspan="3" >
            XXXX</td>
            <td colspan="2" rowspan="3" > 35</td>
        </tr>
        <tr><td width=0></td></tr>
        <tr><td width=0></td></tr>
        <tr> 
            <td width=0></td>
            <td colspan="6" rowspan="2">
            YYYY</td>
            <td colspan="1" rowspan="2" >34</td>
        </tr>
        <tr><td width=0></td></tr>
</table>


与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome To Ask or Share your Answers For Others

1 Reply

0 votes
by (71.8m points)

refers to this comment, i made you the below snippet

<table width="100%" border="1" bgcolor="#ffffff">
<colgroup>
<col  width="25%">
<col width="25%">
<col width="25%">
<col width="5%">
<col width="10%">
</colgroup>

    <tr>
        <td colrow="2" colspan="3"><p>XXX</p><h2> </h2></td>
        <td colrow="2" colspan="2">35</td>     
    </tr>
    <tr>
        <td colrow="2" colspan="4"><p>YYYY</p><h2> </h2></td>
        <td colrow="2" colspan="1">34</td>

    </tr>
</table>

与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
OGeek|极客中国-欢迎来到极客的世界,一个免费开放的程序员编程交流平台!开放,进步,分享!让技术改变生活,让极客改变未来! Welcome to OGeek Q&A Community for programmer and developer-Open, Learning and Share
Click Here to Ask a Question

...