2013-11-18 2 views
1

Я попытался найти ответ на этот вопрос, поскольку он кажется достаточно простым, используя colspan и rowspan, но по какой-то причине я не могу найти способ сделать следующую таблицу:
число ячеек таблицы 4: upper_left, upper_right, BOTTOM_LEFT, BOTTOM_RIGHT

upper_left: 8 рядов длиной
upper_right: 1 ряд длиной
BOTTOM_LEFT: 1 ряд длиной
BOTTOM_RIGHT: 8 рядов длиной
создание таблицы в html, когда оба столбца и строки асимметричны

Я дон нет pic, но вы можете видеть, что и строки, и cols являются асимметричными.

Thanks

+0

По законам физики это кажется невозможным ... Можете ли вы нарисовать то, что ищете? Если нет, тогда у вас есть свой ответ. Если это так, то мы будем понимать ваши требования немного лучше. –

+0

Вам нужно будет нарисовать то, что вам нужно. На первый взгляд это не похоже на то, что таблица - это решение вообще, а скорее абсолютные позиционные div. –

+0

Вероятно, «ряды» не были хорошим словом: upper_left: 800px long, upper_right: 100px long, bottom_left: 100px long, bottom_right: 800px long –

ответ

0

Вам нужно сделать это вот так. В этом случае вы не можете использовать rowspan="8".

<table> 
    <tr> 
     <td rowspan="2">upper left</td> 
     <td>upper right</td> 
    </tr> 
    <tr> 
     <td rowspan="2">bottom right</td> 
    </tr> 
    <tr> 
     <td>upper bottom</td> 
    </tr> 
</table> 

Если вы Мента COLS вместо строк, то вот оно:

<table> 
    <tr> 
     <td colspan="8">upper left</td> 
     <td>upper right</td> 
    </tr> 
    <tr> 
     <td>bottom right</td> 
     <td colspan="8">upper bottom</td> 
    </tr> 
</table> 

И с отредактированной CSS:

<table> 
    <tr> 
     <td colspan="8" style="width: 800px;">upper left</td> 
     <td style="width: 100px;">upper right</td> 
    </tr> 
    <tr> 
     <td style="width: 100px;">bottom right</td> 
     <td colspan="8" style="width: 800px;">upper bottom</td> 
    </tr> 
</table> 
+1

Удивительно, я пробовал каждую возможность, кроме что-то вроде этого. Большое спасибо! –

Смежные вопросы