Как отрегулировать высоту DIV по отношению к другим DIV?

Question

Я создаю веб-сайт для моего школьного проекта. Он имеет различные вложенные DIV. Однако размер DIV различается в зависимости от содержания. Я хочу сделать все DIV переменной высоты, чтобы все получили высоту самого длинного. Вы можете посмотреть мою страницу здесь http://www.risingfaizabad.com/demo/

Пожалуйста, помогите мне.

Answer 1

Использование jQuery (не только CSS) и допущение, что все DIV имеют общий класс для определения только тех, кто вам важен.

$(function() {
    var maxHeight = 0;
    $('div.commonClass').each( function() {
         var height = $(this).height();
         if (height > maxHeight) maxHeight = height;
    });
    $('div.commonClass').height( maxHeight );
});

Или, если вы хотите просто использовать плагин, есть плагин equalHeight .

$(function() {
    $('div.commonClass').equalHeight();
});

Answer 2

Вы можете установить абсолютное позиционирование вложенного DIV, указав смещения его верхней и нижней точек относительно его родительского DIV. Обратите внимание, что родительский DIV сам должен иметь позицию: absolute; или положение: относительное, чтобы это работало. Последнее (позиция: относительная) довольно легко и безопасно

Answer 3

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

Answer 4

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