Css адаптивность

Css адаптивность Как сделать адаптивную верстку?

Итак, основная колонка в фиксированном варианте равна 780 px, её контекст (родитель) в фиксированном варианте имеет ширину 1080px, в итоге:
780 / 1080 = 0.72222222222

левая и правая часть:

16 (нужное значение) / 16(значение по умолчанию) = 1 em
Но я считаю шрифт в 16 пикселей слишком мелким, я предпочитаю 18, поэтому:
18 / 16 = 1.125 em

левая и правая часть:

Гибкие изображения

Медиазапросы

Пример

Важно!

1. Я заметил одну особенность. Когда задаются правила к стилям в @media screen к классам, к ним нужно прописывать некий путь. Например класс #headerInner вообще не работает без стандартного класса body. Если написать просто #headerInner и задать к нему правила, то браузер почему то не применяет эти правила, а вот если написать body #headerInner то начинает всё работать. Так же и для всех других классов. Если класс #3 находится в классе #2 то нужно прописывать #2 #3 иначе правила работать не будут. 2. Если Вы собрались делать шаблон с адаптивным дизайном, обязательно между тегами и добавьте вот этот мета тег: 3. Так же добавьте вот этот код в стилях CSS для картинок И картинки будут автоматически растягиваться и сужаться.

Поддержка браузера Internet Explorer