Принудительное плавание осталось без разрыва строки, несмотря ни на что

Question

Я предполагаю, что это невозможно, но здесь идет.

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

Я не могу найти способ принудительно поставить вторую таблицу рядом с первой. Я могу их всплыть, но когда первая таблица слишком широка, вторая переходит на следующую строку. Вот кикер: ширина первого стола является динамической. Так что я не могу просто установить огромную ширину их контейнера. Ну, я мог бы установить огромную ширину, например 1000%, но тогда у меня есть огромная уродливая горизонтальная полоса прокрутки.

Так есть ли способ сказать второй таблице: "Оставайся на той же самой строке, несмотря ни на что! И выстраивайся прямо рядом с предыдущим элементом, пожалуйста!"

Answer 1

Поместите две таблицы в другую таблицу с одной строкой и двумя ячейками. Не элегантный или «современный», но он будет работать.

Answer 2

Если ваш стол - один стол, вы должны были придерживаться одного стола.

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

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

Я бы не пошел по выбранному вами маршруту.

Answer 3

Как насчет этого:

<div>
<div class=lspacer>
<table1>
</table1>
</div>
<div class=rspacer>
<table2>
</table2>
</div>
</div>

Затем для lspacer вы можете очистить его влево, а для rspacer вы можете очистить его вправо. Также вы указываете ширину.