Tworzenie szerokości stołu do wypełniania td

Question

Mam stół o stałej wysokości 50 pikseli i 100% szerokości.

Wewnątrz tej tabeli Mam dwie div, na tej samej linii, na przykład:

<table> 
    <tr> 
    <td> 
     <div id="1"></div> 
    </td> 
    <td> 
     <div id="2"></div> 
    </td> 
    </tr> 
</table> 

Pierwszy div ma float:left, a drugi ma float:right.

Tak więc tabela zawiera 100% strony. Chcę Div2 zawinąć jego zawartość, a div1 wypełnić pozostałą przestrzeń tak, że Div2 jest wyrównany do prawej strony jak ta:

+--------------------------------------------------------------+ 
| [ DIV 1   (Expands)  ][ DIV 2 AND ITS CONTENTS ] | 
+--------------------------------------------------------------+ 

i co ja obecnie dostać kiedy div1 ma mniej treści niż pełny wiersz:

+--------------------------------------------------------------+ 
| [ DIV 1 ][ DIV 2 ]           | 
+--------------------------------------------------------------+ 

Bez stołu mogę uruchomić go do pracy bezpośrednio na lewo i prawo, ale wtedy, gdy "zejdą się", będą owijać się pod sobą, zamiast obok siebie.

EDYCJA: Dodałem nowy jsfiddle here. Oto działający przykład. Spróbuj usunąć wszystkie linki oprócz jednego z lewego elementu div i zobaczyć wynik. Drugi div powinien pozostać najbardziej prawy. Mam nadzieję, że wyjaśniłem sobie.

Answer 1

Rozwiązano problem polegający na dodaniu do tabeli width:100%.

http://jsfiddle.net/HRT5E/1/

table { 
    width:100%; 
} 

Answer 2

Użyj właściwości "colspan" td. Np .:

<td colspan=75%> info </td> 

Answer 3

Po pierwsze, Twoja tabela nie wydaje się być ustawiona na pełną szerokość strony. Chcesz dodać atrybut stylu lub szerokości do znaczników.

Następnie wystarczy ustawić stałą szerokość po prawej stronie "div" (lub dokładniej <TD>), a pierwsza wypełni pozostałe miejsce.

Jak zauważyli inni, stół opakowania jest niepotrzebny.