Multi-Column-Layout с одинаковой высотой (минимум 100% от области просмотра) и закругленными углами - PullRequest
0 голосов
/ 16 августа 2011

это мой первый вопрос о стековом потоке после большого количества исследований без соответствующего успеха: - (.

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

Как сделать закругленныеуглы на столбцах одинаковой высоты

и, конечно, этот

http://matthewjamestaylor.com/blog/equal-height-columns-cross-browser-css-no-hacks

Но они не справляются, так как используют переполнение: скрытый исделать поддельную высоту намного длиннее, чем когда-либо была бы страница. Поэтому, конечно, цвет фона каждого столбца опускается вниз и дальше. Это нормально, но не достаточно, так как мне нужно формировать фон элемента содержимогосо скругленными углами. Это должно выглядеть как изображение на следующем адресе:

http://www.addorange.de/uploads/3columns_rounded_corners.jpg (извините, я пока не могу размещать изображения: - ()

Может быть, кто-нибудь из вас сталкивался с подобной проблемой, чтобы исправить это чистым CSS.

Спасибо,

Кристиан

1 Ответ

0 голосов
/ 16 августа 2011

Два решения:

  • Вы можете использовать display: table-cell для своих трех столбцов
  • Изменить их размер с помощью JavaScript
...