Перестановка tr

[shareware]

У вас ошибки в таблице, это прежде всего нужно исправить, не может быть в теге TR вложенных TR.

Т.е по вашему разработчики, например, плагина tablesorter просто так решили несколько месяцев / лет назад взять и реализовать вложенные строки для своего детища зная о том, что внутри tr не может быть tr ? )

Это знаете..из разряда - не может быть вложенной table внутри table. Однако это есть и кто-то это практикует для своих задач. Тут та же ситуация. Поэтому говорить что это неправильно - некорректно. Вы же не знаете затеи, а потому.. )

[рони]

Это знаете..из разряда

откройте панель инструментов и посмотрите структуру вашей таблицы, какая она на самом деле.

[laimas]

не может быть вложенной table внутри table

Не может, только в td может быть вложена другая таблица, а в нее tr, а в ней td. Не городите отсебятины, достаточно добавить ячейкам вашей таблицы бордюр и сразу будет виден бардак.

[Malleys]

Нужно начинать с исправления знаний о вложенных строках / таблицах.

Да, вы правы! Вы сами будете исправлять, или только другим советовать? (Другие-то уже разбираются, а вы до сих пор мучаетесь со строками таблицы, не понимая предназначение элемента <tr> — строки таблицы содержат ячейки)

В спецификации HTML описано, как используются строки таблицы — https://www.w3.org/TR/html52/tabular...the-tr-element

Проверяем... «хочу-хочу строчки таблички в другие строчки»

<table>
	<tr>
		<tr>
			<td>В браузере, совместимым со спецификацией HTML, этот фон будет розовым (а не зелёным), поскольку строки таблицы могут содержать в разметке только ячейки!</td>
		</tr>
	</tr>
</table>

<style>

tr {
	background: deeppink;
}

tr > tr {
	background: yellowgreen;
}
	
</style>

Как видите, в браузере таблица работает именно так, как описано в спецификации!

по вашему разработчики, например, плагина tablesorter просто так решили несколько месяцев / лет назад взять и реализовать вложенные строки для своего детища зная о том, что внутри tr не может быть tr ? )

Ничего подобного никогда не было сделано — для группировки в разметке элементов <tr> используется <tbody>. Читайте спецификацию — там всё описано. И вы неожиданно поймёте всё, что касается таблиц!

Запомните — строки таблицы содержат ячейки.

не может быть вложенной table внутри table

Да, в разметке не возможно сделать так... И на самом деле вам не нужно, поскольку данные содержатся в ячейках. Такой селектор не подходит не под один элемент, описанный в разметке — table > table

Однако это есть и кто-то это практикует для своих задач. Тут та же ситуация. Поэтому говорить что это неправильно - некорректно. Вы же не знаете затеи, а потому.. )

Да, более правильней — невозможно! Как вы уже знаете — в разметке такое описать невозможно! А вы говорите о каких-то сомнительных практиках — вас просто обманули!

shareware, у вас в таблице три столбца, но согласно использованию ячеек в вашем примере — вам следует добавить ещё один столбец! Для перемещения строк с определённым классом вы можете использовать СSS-свойство order. Например так...

<table>
	<thead>
		<th>ID</th>
		<th>Имя</th>
		<th>Фамилия</th>
		<th>premium</th>
	</thead>
	<tbody>
		<tr class="not">
			<td>1</td>
			<td>Антоша</td>
			<td>Антоша</td>
			<td>Ne</td>
		</tr>
		<tr class="premium">
			<td>2</td>
			<td>Серега</td>
			<td>Кочегарин</td>
			<td>premium</td>
		</tr>
		<tr class="not">
			<td>3</td>
			<td>Саня</td>
			<td>Жопин</td>
			<td>Ne</td>
		</tr>
		<tr class="premium">
			<td>4</td>
			<td>Ваня</td>
			<td>Жлобин</td>
			<td>premium</td>
		</tr>
	</tbody>
</table>

<style>

table {
	border-collapse: collapse;
}

tbody {
	display: grid;
}

tr {
	display: grid;
	grid-template-columns: 3em 1fr 1fr 1fr;
}

tr.premium {
	order: -1;
}

/* пример раскраски */

table {
	border: 1px solid black;
}

tbody {
	background: linear-gradient(to bottom, #f1f1f1 50%, #fff 0) 0 0 / 100% 4em;
}

tr {
	height: 2em;
	align-items: center;
}

td, th {
	padding: 0 1em;
}

td:first-child, td:last-child {
	text-align: center;
}
	
</style>

[voraa]

Тут просто действует правило автозакрытия тегов.
Если при обработке тега tr встречается тег tr, то текущий автоматически закрывается и начинается новый

<!DOCTYPE html>
<html>
<head>
<style>
td {border: 1px solid blue;}	
table {border: 1px solid red;}	
</style>
</head>
<body>
<table>
	<tr> 
        <td> Это  строка 1</td>
        <!-- Подразумевается, что здесь стоит </tr> -->
		<tr>
			<td>Это  строка 2</td>
		</tr>
	</tr> <!-- Этот тег будет проигнорирован -->
</table>
</body>
</html>