X   Сообщение сайта
(Сообщение закроется через 3 секунды)



 

Здравствуйте, гость (

| Вход | Регистрация )

Открыть тему
Тема закрыта
> Как отменить выравнивание блоков в линию bottstrap? Код и картинка прилагается.
pikiviki
pikiviki
Topic Starter сообщение 10.7.2015, 13:59; Ответить: pikiviki
Сообщение #1


Хочу сразу же извинится за опечатку в заголовке. 

Здравствуйте уважаемые форумчане. Столкнулся с проблемой при использовании bootstrap.
В bootastrpa по умолчанию блоки выравниваются в линию вот так http://codepen.io/anon/pen/PqeOOM
и следующая линия блоков находится на расстоянии самого длинного блока в первой линии блоков. Как сделать так чтобы каждый блок второй линии блоков был сразу же под каждым блоком первой линии. 

Вот более наглядно. 

b229c16d8795.jpg



Сообщение отредактировал pikiviki - 10.7.2015, 14:02
0
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
yury_mw
yury_mw
сообщение 10.7.2015, 19:02; Ответить: yury_mw
Сообщение #2


pikiviki, скрипт http://masonry.desandro.com/ вам в помощь.

Как то так:


<!DOCTYPE html>
<html>
<head>
<meta charset='UTF-8'>
<style>
*{
padding:0;
margin:0;
}
ul.grid{
width:100%;
list-style:none;
}
ul.grid li{
width:30%;
float:left;
background:#ccc;
margin:5px 0 0 5px;
}
</style>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<script src="http://masonry.desandro.com/masonry.pkgd.min.js"></script>
<script>
$(document).ready( function() {
  $('.grid').masonry({
    itemSelector: '.grid li'
  });
});
</script>
</head>
<body>
<ul class="grid">
<li>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Quo ratione unde nam iure odit autem quibusdam sunt enim harum dolore amet recusandae aliquam labore, ea saepe nisi provident ducimus repellat.</li>
<li>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Eius, dolore?</li>
<li>Lorem ipsum dolor sit amet, consectetur adipisicing edivt. Fugit voluptatibus saepe dolorem ullam, assumenda quisquam sequi officia accusamus natus molestias vero quod excepturi magni, nihil fuga vitae. Nesciunt ab maxime inventore expdivcabo suscipit sed asperiores, omnis labore temporibus nam, dolore.</li>
<li>Lorem ipsum dolor sit amet, consectetur adipisicing edivt. Ipsa nobis accusamus ad facere magni, minima nostrum temporibus consectetur at eveniet, porro saepe tenetur, molestiae, repellat quod debitis non quibusdam dolorem vitae. Ut dignissimos, a moldivtia quaerat voluptatum enim ab illum.</li>
<li>Lorem ipsum dolor sit amet, consectetur adipisicing edivt. Sapiente, numquam.</li>
<li>Lorem ipsum dolor sit amet, consectetur adipisicing edivt. Nostrum impedit cupiditate, suscipit officia expdivcabo? Illum non distinctio aut odio iste obcaecati harum soluta a totam, nisi, sed quidem repellat nesciunt.</li>
</ul>
</body>
</html>



Сообщение отредактировал yury - 10.7.2015, 19:15
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
pikiviki
pikiviki
Topic Starter сообщение 10.7.2015, 20:54; Ответить: pikiviki
Сообщение #3


yury_mw, спасибо вам большое вы мне очень помогли. 


Замечание модератора:
Эта тема была закрыта автоматически ввиду отсутствия активности в ней на протяжении 100+ дней.
Если Вы считаете ее актуальной и хотите оставить сообщение, то воспользуйтесь кнопкой
или обратитесь к любому из модераторов.
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
Открыть тему
Тема закрыта
1 чел. читают эту тему (гостей: 1, скрытых пользователей: 0)
Пользователей: 0


Свернуть

> Похожие темы

  Тема Ответов Автор Просмотров Последний ответ
Открытая тема (нет новых ответов) Большие ставки для кликов в Я.Директ. Как удешевить?
2 rownong27 1124 26.3.2024, 14:13
автор: knezevolk
Открытая тема (нет новых ответов) Как вы бросили работу и перешли на заработок с сайтов?
12 uahomka 2298 25.3.2024, 6:52
автор: Skyworker
Открытая тема (нет новых ответов) Как отозвать банковский платеж фрилансеру?
28 metvekot 3922 25.3.2024, 6:34
автор: Skyworker
Открытая тема (нет новых ответов) Как вывести деньги в Украине с заблокированного Юмани ?
23 freeax 3648 24.3.2024, 20:55
автор: Liudmila
Открытая тема (нет новых ответов) Через какой браузер и как можно найти в кэшэ браузера видео
10 Room 1943 23.3.2024, 7:41
автор: Room


 



RSS Текстовая версия Сейчас: 29.3.2024, 16:14
Дизайн