Responsive web design + media quaries. Как верстать адаптивно?

Всем привет, по ходу изучения адаптивной верстки зашел в небольшой тупик. А именно как адаптировать внутренние элементы - заголовки, логотипы и т.д. ?
Я делаю резиновый макет + резиновые картинки и добавляю медиа запросы. Вроде бы все нормально, но медиа у меня получается очень много (11 шт.), через каждые 200px контент вываливается из блоков. Подскажите как врубится по хорошему в эту тему?
  • Вопрос задан
  • 198 просмотров
Пригласить эксперта
Ответы на вопрос 3
DDolgy
@DDolgy
Распи***й
Нужно глянуть всю верстку вообщем. Но еще есть вопрос, используешь фреймворки типа бутстрап? Если нет, то глянь что это, советую. Меньше кода будешь писать
Ответ написан
@samuser
programmer
Попробуй таким образом
@media (min-width: 320px) and (max-width: 480px) {
  
  //CSS
  
}
Ответ написан
Комментировать
alex-1917
@alex-1917
Если ответ помог, отметь решением
Щас ДВА запроса актуальны, какие 11??!!!!!! ну край ТРИ.
@media (max-width:1199px) {} //редко использую
@media (max-width:991px) {} //довольно часто юзаю вась
@media screen and (max-width:767px) {} //то что дохтор прописал
@media (max-width:479px) {} // для маньяков)))


основная хитрость, который ты бы давно уже мог подсмотреть в том же бутстрапе - основной контейнер делается шириной 100% + лимит для экранов выше 991, например max-width=1040px - ВСЁ!!!

мой вариант проверяется в каждом проекте на реальных устройствах (афони все от 4s до восьмерки, ябло-планши все, пара ябло-буков, самсунги 4 смарта и три планша, за глаза!!) так что никого не слушай, Alex-1917 дело говорит!!
Ответ написан
Ваш ответ на вопрос

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

Войти через центр авторизации
Похожие вопросы