Вопросы Теги

Colspan работает с некоторыми комбинациями, но не с другими

Ну, как это сделал бы закон Мерфи, чтение, которое я прочитал после публикации этого вопроса, привело к нескольким результатам - не полностью разрешилось, но несколько полезно тем не менее.

Я играл с минимальной высотой немного до публикации, но не знал о внутренних ограничениях на размер, которые являются довольно новыми для спецификации.

http://caniuse.com/#feat=intrinsic-width

Добавление min-height: min-content в область flexbox устраняет проблему в Chrome, а с префиксами поставщиков также исправляются Opera и Safari, хотя Firefox остается неразрешенным. 

min-height: -moz-min-content; // not implemented
min-height: -webkit-min-content // works for opera and safari
min-height: min-content // works for chrome

для идей по Firefox и других потенциальных решений.

1
задан Kevin Gregor 16 January 2019 в 01:11
поделиться

2 ответа

Я считаю, что это то, что вы хотите 

<table width="100%">
   <tr>
       <td colspan="3" width="33%">a</td>
       <td width="33%">b</td>
       <td width="33%">c</td>
   </tr>
   <tr>
       <td width="10%">1</td>
       <td width="10%">2</td>
       <td colspan="3" width="80%">3+4</td>
    </tr>
</table>
0
ответ дан boom 16 January 2019 в 01:11
поделиться

Итак, вы хотите что-то подобное? 

table, th, td{
  padding: 0;
  margin: 0;
  border-collapse: collapse;
  border:0;
  border-spacing:0;
  margin-left: auto;
  margin-right: auto;
}

table.topInnerTable, table.topInnerTable td{
  border: 1px solid black;
  border-bottom: 0;
}

table.bottomInnerTable, table.bottomInnerTable td{
  border: 1px solid black;
}
<table width="960px">
  <tr>
    <td>
      <table class="topInnerTable" width="100%">
        <colgroup>
          <col width="320px">
          <col width="320px">
          <col width="320px">
        </colgroup>
       <tr>
         <td>4</td>
         <td>4</td>
         <td>4</td>
       </tr>
      </table>
    </td>
  </tr>
  <tr>
    <td>
      <table class="bottomInnerTable">
       <tr>
         <td width="80px">1</td>
         <td width="80px">1</td>
         <td width="800px">10</td>
       </tr>
      </table>
    </td>
  </tr>
</table>

0
ответ дан Nathan Champion 16 January 2019 в 01:11
поделиться