[WMmagnat]

Приветствую Вебмастера!

Нужно помочь разобраться в расстановке блоков на сайте

Скрытый текст (вы должны войти под своим логином или зарегистрироваться и иметь 1 сообщение(ий)):

У вас нет прав чтобы видеть скрытый текст, содержащийся здесь.

Там есть пять блоков в саунами и банями там пять блоков 3 сверху и два снизу, так вот вопрос в двух нижних как сделать и что прописать в коде чтобы эти нижние блоки были по центру и рядом друг с другом?

Вот код :

Код HTML:

 <div class="row"> <div class="col-lg-4"> <li style="width: 300px;margin-left: 340px;"> <img class="g_img" src="img/hamam-v-saratove-1-small.jpg" alt=""/> </a> <span style="font-size: 32px; position: relative; top: 10px; left: 20px;">ХАМАМ</span> <h3 style="font-size: 18px; line-height: 1.2;">Настоящий «Хамам» в Саратове, с его нежным теплом, обилием влажного пара – это то, что вам действительно нужно, чтобы отдохнуть и смыть напряжение дня. </h3> <h3 style="font-size: 18px; line-height: 1.2; margin-top: 5px;">Подарите себе необыкновенно приятное ощущение от посещения сауны с комфортной температурой.</h3> <h3 style="font-size: 18px; line-height: 1.2; margin-top: 5px;"><b>Стоимость : 600 руб/час</b></h3> <a class="btn btn-warning btn-lg btn-block" style="margin: 20px 0;" data-toggle="modal" href="http://saunanew.ru/hamam-v-saratove.html">ПОДРОБНЕЕ</a> </div> </div> <div class="row"> <div class="col-lg-4"> <li style="width: 300px;margin-left: 340px;"> <img class="g_img" src="img/hamam-v-saratove-1-small.jpg" alt=""/> </a> <span style="font-size: 32px; position: relative; top: 10px; left: 20px;">ХАМАМ</span> <h3 style="font-size: 18px; line-height: 1.2;">Настоящий «Хамам» в Саратове, с его нежным теплом, обилием влажного пара – это то, что вам действительно нужно, чтобы отдохнуть и смыть напряжение дня. </h3> <h3 style="font-size: 18px; line-height: 1.2; margin-top: 5px;">Подарите себе необыкновенно приятное ощущение от посещения сауны с комфортной температурой.</h3> <h3 style="font-size: 18px; line-height: 1.2; margin-top: 5px;"><b>Стоимость : 600 руб/час</b></h3> <a class="btn btn-warning btn-lg btn-block" style="margin: 20px 0;" data-toggle="modal" href="http://saunanew.ru/hamam-v-saratove.html">ПОДРОБНЕЕ</a> </div> </div>

За ранее спасибо!

[Pacific]

Все просто, это bootstrap 3

Код HTML:

<div class="row"> <div class="col-lg-2"></div> <div class="col-lg-4">Блок 4</div> <div class="col-lg-4">Блок 5</div> <div class="col-lg-2"></div> </div>

Или совсем как в документации: -offset

<div class="row"> <div class="col-lg-4-offset-2">Блок 4</div> <div class="col-lg-4">Блок 5</div> </div>

[WMmagnat]

Pacific,Спасибо, но честно не понял что на что менять))) Или просто добавить такой код?

[Pacific]

Это структура, сетка так называемая.

сейчас у вас первый ряд выглядит так (наполнение блоков я опустил для наглядности)

Код HTML:

<div class="row"> <div class="col-lg-4">VIP САУНА</div> <div class="col-lg-4">РУССКАЯ БАНЯ</div> <div class="col-lg-4">СОВРЕМЕННАЯ</div> </div>

второй ряд сделайте так

Код HTML:

<div class="row"> <div class="col-lg-4-offset-2">ХАМАМ</div> <div class="col-lg-4">КОТТЕДЖ ПОСУТОЧНО</div> </div>

и все будет по центру

[WMmagnat]

Pacific,Попробовал, но ничего не произошло(((

[Valerij]

Pacific,<div class="row"> <div class="col-lg-4 col-lg-offset-2">ХАМАМ</div> <div class="col-lg-4">КОТТЕДЖ ПОСУТОЧНО</div> </div>

Попробуйте второй ряд

[Pacific]

Valerij,попробовал, все как и должно быть два блока по центру. Сделал не один сайт с этим фреймворком.

WMmagnat,
Подробнее что вы сделали, что значит "Ничего не произошло" ?

Вот ссылка на оригинал документации,
_http://getbootstrap.com/css/#grid

Цитата;

Код HTML:

Move columns to the right using .col-md-offset-* classes. These classes increase the left margin of a column by * columns. For example, .col-md-offset-4 moves .col-md-4 over four columns.

---------- Сообщение добавлено 10:32 ---------- Предыдущее 10:25 ----------

:-) если совсем никак
5 минут, FTP доcтуп и 5 баксов (по идейным соображениям не могу бесплатно) я расставлю вам блоки