Name: Блоки Bootstrap одинаковой высоты
Item: Блоки Bootstrap одинаковой высоты
Author: vilyvykidnye

Версия: v1.0

Каталог: Сниппеты Bootstrap

Категория: Скрипты

Bootstrap: 3, 4

Для CMS: HTML, Drupal, Joomla, uCoz, WordPress, Magento, OpenCart, PrestaShop

Язык: Русский

Уникальный ID: 1241

Количество символов:

Посмотрели: 6602 раз

Помощь: установка & настройка

Прокомментировали: 2 раз

Рейтинг: 4.2 / 5 - 5 голосов

Тип лицензии: CC BY 4.0

Авторство: bootstraptema.ru

Информация: Пользователям

Информация: Правообладателям

Теги: Скрипт, Script, Snippet, blocks, Блоки, height, сниппет, Bootstrap, высота, html

Поделился: BootstrapТема

Добавлено: 2016-08-26 в 10:16

Метка: 1581110847

⇄ ⇅

<h2 class="text-center">Блоки Bootstrap одинаковой высоты</h2>

<div class="col-md-6">
<h3>Описание</h3>
 <p>
Блоки с помещённым в них контентом будут равной высоты, высота уравнивается скриптом jQuery.
 </p>
 <p>
По умолчанию выравниваются все <code>&lt;div&gt;</code> находящиеся внутри <code>class="row"</code>.
 </p>
</div>

<div class="col-md-6">
<h3>Скрипт</h3>
<pre><code>
&lt;script&gt;
var equal_height = 0;
$(".row div").each(function(){
if ($(this).height() &gt; equal_height) { equal_height = $(this).height(); }
});
$(".row div").height(equal_height);
&lt;/script&gt;
</code></pre>
</div>
 
</div>
</div>

Всего комментариев: 2
Порядок вывода комментариев: -1 1 vilyvykidnye • 20:42, 2017-04-14 не работает 0 2 BootstrapТема • 05:02, 2017-04-15 В редакторе работает!

BootstrapTema

Блоки Bootstrap одинаковой высоты

Скриншот

Подробнее

Похожие материалы

Просмотренные материалы