Столбцы с фиксированной жидкостью в таблице - PullRequest
Новая
       8

Столбцы с фиксированной жидкостью в таблице

0 голосов
/ 23 декабря 2009 
<table>
  <tr>
     <td>Fixed-Width Column: 250px</td>
     <td>Fluid Width Column: remaining width</td>
  </tr>
</table>

Я не создаю макет страницы с этим, и мне нужно использовать Table. Есть ли способ добиться этого кросс-браузер? Я уже использую jQuery в этом проекте, если это поможет?

Ответы [ 2 ]

4 голосов
/ 23 декабря 2009 
<table width="100%">
  <tr>
     <td width="250">Fixed-Width Column: 250px</td>
     <td width="*">Fluid Width Column: remaining width</td>
  </tr>
</table>

Кроме того, вы можете поместить информацию о стиле в свой CSS. HTML-код для этого выглядит так: 

<table class="styletable">
  <tr>
     <td class="navigation">Fixed-Width Column: 250px</td>
     <td class="maincontent">Fluid Width Column: remaining width</td>
  </tr>
</table>

CSS будет: 

.styletable {
    width: 100%;
}

.navigation {
    width: 250px;
}

Основной контент автоматически получит оставшуюся ширину.

Вы можете добиться того же результата с помощью макета на основе <div>. HTML: 

<div>
     <div class="navigation">Fixed-Width Column: 250px</div>
     <div class="maincontent">Fluid Width Column: remaining width</div>
</div>

и CSS: 

.navigation {
    width: 250px;
    float: left;
}

.maincontent {
    margin-left: 260px;
}
0 голосов
/ 23 декабря 2009

Хорошо, понял, это: 

<table>
  <tr>
     <td width="250px">Fixed-Width Column: 250px</td>
     <td>Fluid Width Column: remaining width</td>
  </tr>
</table>

Я пока не знаю, работает ли он кросс-браузерно.

...