Блог

Главная - Вопросы по программированию - Адаптивные элементы по высоте

Адаптивные элементы по высоте

#jquery #html #css #twitter-bootstrap-3 #adaptive-design

#jquery #HTML #css #twitter-bootstrap-3 #адаптивный дизайн

Вопрос:

Например, у меня есть два блока, как на картинке.

Блоки

Как я могу сделать так, чтобы элементы в Block2 имели ту же высоту, что и Block1?

Комментарии:

1. Как насчет старого доброго <table /> ?

2. В зависимости от того, для чего это используется, да, таблица справилась бы с этой задачей.

3. Было сложно переделать это с помощью table, но это работает. Спасибо.

Ответ №1:

вот и все:

css

  .container{overflow:auto;width:400px;background:green;}
    .block1, .block2{float:left;width:50%;background:red;height:300px;}
    .elem{height:40px;background:blue;width:100%}

HTML

 <div class="container">
    <div class="block1">test block 1</div>
    <div class="block2">
        <div class="elem">element 1</div>
        <div class="elem">element 2</div>
        <div class="elem">element 3</div>
        test block 2
    </div>
</div>

http://jsfiddle.net/94Xtn/