html высота строки параллельных таблиц - PullRequest
1 голос
/ 09 февраля 2012

Я работаю над страницей HTML, где мне нужно отображать две таблицы рядом.Высота строк второй таблицы будет динамической, поскольку данные в ней будут сгенерированы по мере запуска программы, тогда как первая таблица имеет фиксированную длину данных.Теперь я застрял в выравнивании обеих строк таблицы.Если длина данных второй таблицы увеличивается, то ее строка не будет выровнена с соответствующей строкой в ​​первой таблице.Может быть, третья строка второй таблицы стоит перед пятой строкой первой таблицы.

Ограничение здесь это две отдельные таблицы и не можетбыть объединены в одну таблицу.

Для обеих таблиц font-size = 12px и padding = 5 pixel.Может кто-нибудь предложить мне формулу, которая может вычислить высоту строки второй таблицы, чтобы можно было установить одинаковую высоту для соответствующей строки в первой таблице (с помощью какого-либо метода), и обе строки могут быть выровнены друг с другом.

Ниже приведена формула, которая пришла мне в голову, но не сработала -

высота строки в первой таблице = (12 * количество строк в строке второй таблицы) + 5 + 5.

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

1 Ответ

0 голосов
/ 10 февраля 2012

Получил решение !!!

Каждая строка в строке второй таблицы занимает 14 пикселей. Думаю, 12 пикселей для высоты строки и 2 пикселя для пространства.

Следовательно, формула будет -

height of row in first table = (14*number of lines in row of second table) + 5 + 5

Я применил эту формулу, и теперь строки двух таблиц синхронизированы.

Как я получил это - Я создал дубликат HTML-страницы и создал ряд строк данных в каждой строке в порядке возрастания во второй таблице. Как -> 1-й ряд = 2 строки, 2-й ряд = 3 строки, 3-й ряд = 4 строки и так далее. Затем вручную установите пиксели строк первой таблицы, чтобы выровнять их по аналогам. Я обнаружил, что они следуют шаблону и имеют разницу в 14 пикселей.

Проблема решена:)

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...