Развернуть только одну ячейку таблицы

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

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

Но когда новое содержание добавляется в ячейку таблицы 2 (который переполнение скрытой, и отлично работает с дисплеем: блок) он расширяется, переполнения никогда не бывает, а ячейка таблицы 1 по высоте теперь соответствует ячейке таблицы 2.

Что я хочу, когда добавляется больше контента в ячейку таблицы 2, он будет показывать содержимое до ячейки таблицы 1, тогда остальное скрыто. Я понимаю, что могу сделать это в javascript, любую идею, как это сделать без него?

Вот JSFiddle: http://jsfiddle.net/dYsNx/

Col 2 должен идти только до высоты COL1 в содержании, остальные должны быть скрыты от переполнения

источник

2012-06-09 Air In

Вы сделали ячейку 2 фиксированной? ячейки таблицы будут естественно расти, чтобы соответствовать их содержимому, если вы не исправите их размер. –

Можете ли вы показать код? Или JSFiddle?Я имею в виду, что я не могу правильно понять вашу проблему. Разве вы хотите «colspan» или «rowspan»? –

Здесь вы идете: http://jsfiddle.net/dYsNx/ - Col 2 должен только подниматься до высоты col1 в контенте, отдых должен быть переполнен скрытым –

переполнения: скрытый не следует использовать таким образом. Но вы поняли концепцию.

Другие, я видел, что ваш код не очень чист и соблюден стандарт. Таким образом, я бы изменить его на моем пути (надеюсь, что это лучше)

Пожалуйста, обратитесь к следующей ссылке: http://jsfiddle.net/Edditoria/TGfzA/

Как вы видите, overflow: hidden; находится в #box, а затем установить position: relative; без верхней/левой установки.

Во избежание отображения: проблема совместимости с таблицей IE < 7, пожалуйста, просто сохраните настройку отображения div по умолчанию в CSS. Я бы использовал% вместо фиксированной ширины пикселей, чтобы избежать проблем с отображением IE!

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

В col2 (и все остальные столбцы) вам нужно будет добавить position: absolute; top: 0px; left: 50%;.

Я меняю col-x от ID к классу, так как вам может понадобиться добавить больше столбцов позже.

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

источник

2012-06-09 10:48:14 Edditoria

Извините за код, я просто написал его с нуля в JSFiddle без подсказок кодов и всего остального славного материала, так как мой код был немного сложнее для копирования и вставки (но стандартного соответствия;]). - Было бы прекрасно, если бы не забыл упомянуть, что переполнение должно было показывать полосу прокрутки y, например: overflow-y: scroll; - но когда я его применяю, полоса прокрутки отключается. - Я думаю, что я просто оставлю второй столбец встроенным блоком фиксированной высоты, он кажется менее проблематичным. –

LOL, я тоже пишу коды сообщений без подсказок. И я плохо знаю английский. Я пытаюсь понять это. Не могли бы вы нажать ссылку, чтобы увидеть снова? Полоса прокрутки y будет отображаться только при необходимости (автоматически), а не скрывать дополнительную информацию, превышающую высоту. Все, что вам нужно сделать, это добавить 'height: 100%;' – Edditoria

Спасибо, отлично! –

Это невозможно с помощью чистого CSS. Это из спецификации CSS 2.1 (http://www.w3.org/TR/CSS2/tables.html#height-layout):

В CSS 2.1 высота ячейки ячейки - минимальная высота, требуемая контентом.

Высота «таблица-строка» коробки элемента вычисляется, как только агент пользователя имеет все ячейки в строке имеются: это есть максимум вычисленной «высоты» в строке и, вычисленная «высоты 'каждой ячейки в строке и минимальной высоты (MIN), требуемой ячейками.

источник

2012-06-09 11:05:06 user907860

Развернуть только одну ячейку таблицы

ответ

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