HTML5 Colspan - альтернативный

Question

Я использую «colspan» в одном из тегов td в своем HTML. Я не хочу использовать «colspan» в своем HTML. Но все же мне нужно достичь функции, которая была достигнута «colspan». Есть ли способ достичь этого?

Answer 1

Эффект colspan может быть смоделирован с использованием таблицы фиктивными пустыми ячейками <td></td> для слотов, которые должны быть натянуто и абсолютно позиционированиями ячейки, которая должна охватить их. Вам нужен относительно позиционируемых обертку div для таблицы, так как вы не можете напрямую сделать таблицу в систему отсчета для позиционирования.

Это становится довольно уродливым, тем более что вам нужно беспокоиться о высоте строки - потому что создание ячейки абсолютно позиционируется, отнимает ее от форматирования таблицы. Вы можете справиться с этим, используя копию содержимого ячейки в качестве содержимого фиктивной ячейки, которая должна быть натянута. См. jsfiddle.

Это становится сложнее, так что любое программное обеспечение, которое не может справиться с простой colspan может не справиться с этим тоже (по крайней мере, если она отвечает за рендеринга документа).

Answer 2

$(document).on('click', 'input#submitHtml', function(){ 
    $('htmlToSend').find('tr').removeAttr('colspan'); 
    // Submit the form. 
}); 

Answer 3

Вы можете использовать сетку, подобную структуре, используя divs.

<div> 
    <div class='headerrow'> 

    </div> 
    <div class='bodyrow'> 
     <div class='bodycell'> 

     </div> 
     <div class='bodycell'> 

     </div> 
    </div> 
</div>