Обтекание картинки текстом и выравнивание блока картинок

  • 5 Ответов
  • 550 Просмотров

0 Пользователей и 1 Гость просматривают эту тему.

Приветствую уважаемые! Прошу помощи более опытных сотоварищей, не хватает своих знаний. 2 проблемы которые никак не решу.
1. Ссылка "Вернуться назад" никак не хочет размещаться ниже всех картинок и размещается слева.
2. Как выровнять по центру блок картинок.
Адрес проблемы http://забтех.рф/glavnaya/535-v-tekhnikume-proshel-den-otkrytykh-dverej-na-kotorom-prisutstvovalo-bolee-200-shkolnikov?template=accessibility
пс: пусть вас не смущает "странность" сайта, по действующему российскому законодательству каждое учебное заведение обязано иметь версию сайта для слабовидящих. Вот это она и есть.
пс2: надеюсь не ошибся разделом.

*

Оффлайн AlekVolsk

Для начала все ссылки с картинками объедините в один блок (сейчас их три, причем в первых двух всего по одной ссылке). В стилях пропишите:
Код: (css) [Выделить]
.clearfix {display:block;float:none;clear:both;}и в конец блока добавьте <span class="clearfix"></span> - это заставит ссылку "вернуться назад" сместиться вниз.

Для всего блока картинок задайте выравнивание по центру, далее поправьте стили вывода ссылок:
Код: (css) [Выделить]
.highslide {
    outline: medium none;
    text-decoration: none;
    display: inline-block;
    float: none !important;
}

*

Оффлайн IzrA

1. #back_link {
  float: left;
  width: 100%;
}
2. Все картинки полижите в один параграф. Параграфу text-align:center; У картинок уберите float: left;
Вот содержимое div class="item-page" после исправлений.
<div class="item-page">

<h2>
  <a href="/glavnaya/535-v-tekhnikume-proshel-den-otkrytykh-dverej-na-kotorom-prisutstvovalo-bolee-200-shkolnikov">
В техникуме прошел «День открытых дверей», на котором присутствовало более 200 школьников. </a>
</h2>

<p style="text-align: justify;">Коллектив и студенты охотно приглашали учащихся школ на обучение &nbsp;в техникум по различным специальностям.&nbsp;</p>
<p style="text-align: center;">
  <a href="/images/vosprab/april2015/1/image035.jpg" class="modal"></a>
  <a style="margin: 0px 10px 0px 0px; padding: 5px;" title="В техникуме прошел «День открытых дверей», на котором присутствовало более 200 школьников. " onclick="return hs.expand(this, hs_image)" class="highslide" href="/images/vosprab/april2015/1/image035.jpg" id="thumb5351"><img class="hs_border" title="В техникуме прошел «День открытых дверей», на котором присутствовало более 200 школьников. " alt="image035" src="/plugins/content/hsimage/highslide/image.php?image=/images/vosprab/april2015/1/image035.jpg&amp;width=250&amp;height=1&amp;cropratio=&amp;quality=80&amp;color=fff&amp;reduce=1"></a>
  <span title="Close" onclick="return hs.close(this)" class="highslide-overlay closebutton" id="closebutton"></span>
  <a href="/images/vosprab/april2015/1/image036.jpg" class="modal"></a>
  <a style="margin: 0px 10px 0px 0px; padding: 5px;" title="В техникуме прошел «День открытых дверей», на котором присутствовало более 200 школьников. " onclick="return hs.expand(this, hs_image)" class="highslide" href="/images/vosprab/april2015/1/image036.jpg" id="thumb5352"><img class="hs_border" title="В техникуме прошел «День открытых дверей», на котором присутствовало более 200 школьников. " alt="image036" src="/plugins/content/hsimage/highslide/image.php?image=/images/vosprab/april2015/1/image036.jpg&amp;width=250&amp;height=1&amp;cropratio=&amp;quality=80&amp;color=fff&amp;reduce=1"></a>
  <span title="Close" onclick="return hs.close(this)" class="highslide-overlay closebutton" id="closebutton"></span>
  <a href="/images/vosprab/april2015/1/image037.jpg" class="modal"></a><a style="margin: 0px 10px 0px 0px; padding: 5px;" title="В техникуме прошел «День открытых дверей», на котором присутствовало более 200 школьников. " onclick="return hs.expand(this, hs_image)" class="highslide" href="/images/vosprab/april2015/1/image037.jpg" id="thumb5353"><img class="hs_border" title="В техникуме прошел «День открытых дверей», на котором присутствовало более 200 школьников. " alt="image037" src="/plugins/content/hsimage/highslide/image.php?image=/images/vosprab/april2015/1/image037.jpg&amp;width=250&amp;height=1&amp;cropratio=&amp;quality=80&amp;color=fff&amp;reduce=1"></a><span title="Close" onclick="return hs.close(this)" class="highslide-overlay closebutton" id="closebutton"></span><a href="/images/vosprab/april2015/1/image039.jpg" class="modal"></a><a style="margin: 0px 10px 0px 0px; padding: 5px;" title="В техникуме прошел «День открытых дверей», на котором присутствовало более 200 школьников. " onclick="return hs.expand(this, hs_image)" class="highslide" href="/images/vosprab/april2015/1/image039.jpg" id="thumb5354"><img class="hs_border" title="В техникуме прошел «День открытых дверей», на котором присутствовало более 200 школьников. " alt="image039" src="/plugins/content/hsimage/highslide/image.php?image=/images/vosprab/april2015/1/image039.jpg&amp;width=250&amp;height=1&amp;cropratio=&amp;quality=80&amp;color=fff&amp;reduce=1"></a><span title="Close" onclick="return hs.close(this)" class="highslide-overlay closebutton" id="closebutton"></span><a href="/images/vosprab/april2015/1/image040.jpg" class="modal"></a><a style="margin: 0px 10px 0px 0px; padding: 5px;" title="В техникуме прошел «День открытых дверей», на котором присутствовало более 200 школьников. " onclick="return hs.expand(this, hs_image)" class="highslide" href="/images/vosprab/april2015/1/image040.jpg" id="thumb5355"><img class="hs_border" title="В техникуме прошел «День открытых дверей», на котором присутствовало более 200 школьников. " alt="image040" src="/plugins/content/hsimage/highslide/image.php?image=/images/vosprab/april2015/1/image040.jpg&amp;width=250&amp;height=1&amp;cropratio=&amp;quality=80&amp;color=fff&amp;reduce=1"></a><span title="Close" onclick="return hs.close(this)" class="highslide-overlay closebutton" id="closebutton"></span><a href="/images/vosprab/april2015/1/image042.jpg" class="modal"></a><a style="margin: 0px 10px 0px 0px; padding: 5px;" title="В техникуме прошел «День открытых дверей», на котором присутствовало более 200 школьников. " onclick="return hs.expand(this, hs_image)" class="highslide" href="/images/vosprab/april2015/1/image042.jpg" id="thumb5356"><img class="hs_border" title="В техникуме прошел «День открытых дверей», на котором присутствовало более 200 школьников. " alt="image042" src="/plugins/content/hsimage/highslide/image.php?image=/images/vosprab/april2015/1/image042.jpg&amp;width=250&amp;height=1&amp;cropratio=&amp;quality=80&amp;color=fff&amp;reduce=1"></a><span title="Close" onclick="return hs.close(this)" class="highslide-overlay closebutton" id="closebutton"></span><a href="/images/vosprab/april2015/1/image045.jpg" class="modal"></a><a style="margin: 0px 10px 0px 0px; padding: 5px;" title="В техникуме прошел «День открытых дверей», на котором присутствовало более 200 школьников. " onclick="return hs.expand(this, hs_image)" class="highslide" href="/images/vosprab/april2015/1/image045.jpg" id="thumb5357"><img class="hs_border" title="В техникуме прошел «День открытых дверей», на котором присутствовало более 200 школьников. " alt="image045" src="/plugins/content/hsimage/highslide/image.php?image=/images/vosprab/april2015/1/image045.jpg&amp;width=250&amp;height=1&amp;cropratio=&amp;quality=80&amp;color=fff&amp;reduce=1"></a><span title="Close" onclick="return hs.close(this)" class="highslide-overlay closebutton" id="closebutton"></span><a href="/images/vosprab/april2015/1/image046.jpg" class="modal"></a><a style="margin: 0px 10px 0px 0px; padding: 5px;" title="В техникуме прошел «День открытых дверей», на котором присутствовало более 200 школьников. " onclick="return hs.expand(this, hs_image)" class="highslide" href="/images/vosprab/april2015/1/image046.jpg" id="thumb5358"><img class="hs_border" title="В техникуме прошел «День открытых дверей», на котором присутствовало более 200 школьников. " alt="image046" src="/plugins/content/hsimage/highslide/image.php?image=/images/vosprab/april2015/1/image046.jpg&amp;width=250&amp;height=1&amp;cropratio=&amp;quality=80&amp;color=fff&amp;reduce=1"></a><span title="Close" onclick="return hs.close(this)" class="highslide-overlay closebutton" id="closebutton"></span><a href="/images/vosprab/april2015/1/image048.jpg" class="modal"></a><a style="margin: 0px 10px 0px 0px; padding: 5px;" title="В техникуме прошел «День открытых дверей», на котором присутствовало более 200 школьников. " onclick="return hs.expand(this, hs_image)" class="highslide" href="/images/vosprab/april2015/1/image048.jpg" id="thumb5359"><img class="hs_border" title="В техникуме прошел «День открытых дверей», на котором присутствовало более 200 школьников. " alt="image048" src="/plugins/content/hsimage/highslide/image.php?image=/images/vosprab/april2015/1/image048.jpg&amp;width=250&amp;height=1&amp;cropratio=&amp;quality=80&amp;color=fff&amp;reduce=1"></a><span title="Close" onclick="return hs.close(this)" class="highslide-overlay closebutton" id="closebutton"></span></p>

</div>

UPD:
Уже ответили пока писал. :)
Спасибо для меня слишком много. Стакан вина Плюс в репутацию - в самый раз.

Велосипедист — бедствие для экономики. Он не покупает автомобиля и не берет под него кредит. Не покупает бензин. Не пользуется услугами ремонтных мастерских. Не страхует «гражданскую ответственность». Не пользуется платными стоянками. Не страдает от ожирения. Да он еще и здоров, черт возьми! Здоровые люди не нужны для экономики. Они не покупают лекарства. Они не ходят к частным врачам. Они не увеличивают ВВП.

*

Оффлайн AlekVolsk

Судя по всему, картинки выводятся плагином галереи.

Судя по всему, картинки выводятся плагином галереи.
да, вы правы, выводятся модулем highslide(hsimage). Поэтому в коде 3 абзатца, которые не получается собрать в один. Максимум что у меня получилось так это обрамить их одним DIVом, но выровнять по центру не удалось.

Очередная победа плагина надо мной 0:3. Толком не пойму работу плагина чтобы поправить код так как советовали. Или превьюшки центрируются, но сами вертикально выстраиваются, либо получилось все отцентровать, но первые 2 картинки из первых двух параграфов стоят особняком.
А нельзя как-то прописать CSS стили для этого кода, который сейчас формируется плагином чтобы все стало по центру?