Не нравятся результаты поиска? Попробуйте другой поиск!
DLE FAQ » Все вопросы » Общие вопросы по вёрстке » Съезжают блоки при разном разрешении экрана

Съезжают блоки при разном разрешении экрана


     10.01.2014    Общие вопросы по вёрстке, Шаблоны (TPL), Стили (CSS)    4407

вопрос
Сделал блоки в четыре колонки, но при разных разрешениях экрана они смотрятся очень криво. Как с этим справиться?
Вот, для примера, что происходит при разрешении 1024 x 768.


Вот shortstory
<div class="viewn_cont">              
      <div style="width:25%;float:left;">
      <div class="short-story">
          <span class="img-size"><a href="{full-link}">{short-story}</a></span>
          <div class="price"><center><b>[xfvalue_price] руб.</b></center></div>
      </div>
      </div>
</div>  

Ответа пока нет


11 комментариев

KAPTMEH
Юзер

KAPTMEH - 10 января 2014 14:55 -

Попробуйте так

<div class="viewn_cont">              
      <div style="width:25%;float:left;">
      <div class="short-story">
          <span class="img-size"><a href="{full-link}">{short-story}</a></span>
          <div class="price"><center><b>[xfvalue_price] руб.</b></center></div>
      </div>
      </div>
      <div style="clear:both;"></div>
</div>

ale-eex
Юзер

ale-eex - 10 января 2014 15:02 -

Все блоки выравнялись в одну строку. Вот и все =(

KAPTMEH
Юзер

KAPTMEH - 10 января 2014 15:05 -

А у блока в котором находятся эти новости ширина указана?
Который сужается на скрине
В личку киньте ссылку на сайт

ale-eex
Юзер

ale-eex - 10 января 2014 15:10 -

Вроде бы нет.

D0Gmatist
Юзер

D0Gmatist - 10 января 2014 15:17 -

Как по мне то float:left; и float:right; корявые для использования в таких случаях ...

я всегда использую display: inline-table;
Пример

если нужно выравнивание по верху то дописываем vertical-align: top;
Пример

KAPTMEH
Юзер

KAPTMEH - 10 января 2014 15:24 -

Структура построения новости неправильная зачем viewn_cont див? Удалите его, гляньте, либо пропишите ему высоту и ширину...

KAPTMEH
Юзер

KAPTMEH - 10 января 2014 15:42 -

Или вот тут поменяйте значение min-height на большое, а вообще не правильно использовать стили прям в html...

<div class="side_center input_style" role="main" style="min-height: 429px;">

KAPTMEH
Юзер

KAPTMEH - 10 января 2014 15:59 -

Ещё бы я убрал float:left; из этой строки <div style="width:25%;float:left;"> и прописал её к диву с классом viewn_cont

ale-eex
Юзер

ale-eex - 10 января 2014 17:53 -

Ничего не помогает...

ale-eex
Юзер

ale-eex - 12 января 2014 10:40 -

Ладно, видимо ничего с этим не поделать =(

D0Gmatist
Юзер

D0Gmatist - 12 января 2014 11:29 -

Можно .. руки на рельсу и ждать ТУ-ТУуууу )))

Чтобы комментировать - войдите или зарегистрируйтесь на сайте

Похожие вопросы

наверх