Перемещение <td> элементов в таблице

Допустим, у меня есть таблица HTMLПеремещение <td> элементов в таблице

|td,td,td| 
|td|

если бы я хотел, чтобы переместить тд в нижнем ряду над справа от строки. Как мне это сделать? Также я не могу использовать colspan of 3. Мне нужно переместить всю ячейку.

конечный результат

|td,td,td| 
|  td|

источник

2015-12-07 Seal

css'float:? right' или просто добавьте две пустые ячейки перед вашей «реальной» ячейкой. –

float просто перемещает текст внутри ячейки, и я хотел сделать его чистым, поэтому мне не нужно было добавлять 2 ячейки до этого lol. – Seal

плавать всю ячейку, а не содержимое ячейки. '' –

Либо создать заполнители:

<tr> 
    <td>...</td> 
    <td>...</td> 
    <td>...</td> 
</tr> 
<tr> 
    <td></td> 
    <td></td> 
    <td>...</td> 
</tr>

Или использовать Объединение столбцов:

<tr> 
    <td>...</td> 
    <td>...</td> 
    <td>...</td> 
</tr> 
<tr> 
    <td colspan="3">...</td> 
</tr>

Или как:

<tr> 
    <td>...</td> 
    <td>...</td> 
    <td>...</td> 
</tr> 
<tr> 
    <td colspan="2"></td> 
    <td>...</td> 
</tr>

источник

2015-12-07 19:23:23 Malk

colspan фактически не перемещает всю ячейку, она просто растягивает текущую. И я не хотел ставить заполнителей. – Seal

Вам нужно будет сделать один из этих двух вариантов. –

Таким образом, использование Malks отвечает только на то, чтобы переместить ячейку без colspans, чтобы добавить ячейки-заполнители. Я не хотел добавлять кучу ячеек, поэтому я их зацикливал. Im используя рубин, так что я сделал что-то вроде этого

<% 9.times do %> 
    <td></td> 
<% end %> 

<td>My cell has been pushed over 9 cells</td>

источник

2015-12-07 19:30:21 Seal

<table border="1" style="height:300px; width:300px"> 
    <tr> 
    <td>1</td> 
    <td>2</td> 
    <td>3</td> 
    </tr> 
    <tr> 
    <td></td> 
    <td></td> 
    <td>4</td> 
    </tr> 
</table>

источник

2015-12-07 19:32:07

Уважаемая печать, хотя я еще не понял ваш вопрос, но я думаю, что этот код даст вам необходимый результат –

Используйте Colspan и место пустых ячеек, пока вы не получите ваш столбец смещения и использовать CSS, чтобы скрыть их из вида. Просто!

В вашем CSS:

td.hidden-cell 
{ 
    visibility: hidden; 
}

В ваших таблицах (например, в виде таблицы с 6 колонок, в которых 4 должны быть скрыты в последней строке, используя один из них насчитывает

<tr colspan="5" class="col-lg-offset-2"> 
     <td class="hidden-cell"></td> 
     <td class="hidden-cell"></td> 
     <td class="hidden-cell"></td> 
     <td class="hidden-cell"></td> 
     <td><strong>Total:</strong></td> 
     <td></td> 
</tr>

позволит вам получить что-то вроде этого:

источник

2015-12-07 21:30:27

Перемещение <td> элементов в таблице

ответ

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