HTML表格具有100％的宽度，但TD越来越大？

Question

I have a table which its width is 100%;

I have 2 TDs.

However I want the second td to be near to the left end. ( right after the ccccccc...)

There is a solution which uses 1 more td which its width is 100%.

Something like

<table id="mytable"style="width:100%;background:red"><tr>
    <td>TEXT1</td>
    <td>TEXT2</td>
    <td style="width:100%;background:blue">&nbsp;</td>
    </tr></table>

But , I was wondering if there's another solution without another TD ?

Answer 1

Try this: http://jsfiddle.net/Rrkky/144/ Does exactly what you're asking for.

HTML

<table id="mytable"style="width:100%;background:red">
    <tr>
    <td class="firstcell">aaaa</td>
    <td>TEXT2</td>
    </tr>
    <tr>
    <td class="firstcell">bbbbbbb</td>
    <td>TEXT2</td>
    </tr>
    <tr>
    <td class="firstcell">ccccccccccccccc</td>
    <td>TEXT2</td>
    </tr>
</table>

CSS

#mytable td {
    width:50px;
    background:green
}

#mytable td.firstcell {
    background:red;
    width:1%;
}

Answer 2

What about this ?

<table id="mytable"style="width:100%;background:red">
    <tr>
        <td>aaa</td>
        <td width="100%">Royi</td>
    </tr>
    <tr>
        <td>bbbbbb</td>
        <td width="100%">Royi</td>
    </tr>
    <tr>
        <td>cccccccccccccccc</td>
        <td width="100%">Royi</td>
    </tr>
</table>

Answer 3

http://jsfiddle.net/rjsAG/

Just do not add the last TD but use width:100% for the second one

Answer 4

CSS

tr td:not(:first-of-type){
    width:100%
}

or

tr td{
    width:100%
}
tr td:first-child{
    width:1%
}