@Ciscoridze

Адаптивная верстка. Правильно ли?

В верстке особо не разбираюсь, но хочу разобраться.
Мне надо, чтобы таблицы с картинкой внутри div на всех мониторах выводились одинаково, правильно ли я делаю?
<div class="col-lg-1 col-md-1 col-sm-1 col-xs-1" style="height: 603px;">
  <div class="info-box info-box2">
     <div class="img">
        <img src="images/uploads/test/arrow.png" style="width: 70%;">
     </div>
  </div><!-- /.info-box -->
</div>


Есть какой-нибудь маст-рид гайд по этой теме? Годные уроки может быть.
  • Вопрос задан
  • 293 просмотра
Решения вопроса 2
krimtsev
@krimtsev
Вот тут подробно всё объясняется и показывается

webformyself.com/minikurs/bootstrap/index-subscrib...
Ответ написан
Комментировать
col-lg-1 col-md-1 col-sm-1 col-xs-1 вот это изначально неправильно, запись не имеет смысла, бутстрап работает таким образом что если вы задали к примеру
<div classs="col-sm-3">
</div>


то все что выше (т.е md и lg) будут col-md-3 и col-lg-3
а все что ниже (xs) станет col-xs-12
то есть задайте просто col-xs-1 и все, но это не имеет особого смысла так как скажем на телефоне шириной 320px дисплей поделится на 12 частей и рассмотреть что то будет сложно, можно попробовать к примеру
<div class="col-md-4 col-sm-3 col-xs-6">
content
</div>


если картинка находится внутри блока то дайте ей класс и присвойте значения
width:100%;
height:auto;


и она будет масштабировать под блок не теряя пропорций
Ответ написан
Пригласить эксперта
Ответы на вопрос 1
PretorDH
@PretorDH
HTML5, CSS3, PHP, JS - люблю в чистом виде.
Вот это не правильно:
style="height: 603px;"

Определи класс и задай высоту в нем.
Для картинки указывай ширину в арибуте, а не инлайн-стиле.
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы
23 нояб. 2024, в 01:31
1000 руб./за проект
23 нояб. 2024, в 00:16
2000 руб./за проект