Резиновая верстка сайта — что это такое?

Те, кто хоть немного что-то понимает в процессе верстки сайтов, обычно сталкиваются с терминами «резиновый макет», «тянущаяся ширина» и т.д. Все это термины, напрямую касающиеся резиновой верстки сайта. Что это такое? Давайте посмотрим.

Простые виды верстки можно разделить на фиксированную и резиновую. В чем особенность резиновых размеров? Ширина блоков меняется с уменьшением или увеличением ширины окна браузера. Например, если вы прописали вашему сайту ширину в 100%, то у него никогда не появится горизонтальный скролл, сколько бы вы ни уменьшали окно.

Итак, разобрались с тем, что такое резиновая верстка сайта. Примеры таких макетов можно найти в интернете. Очень важно прописать css-свойства max-width и min-width. Например, при максимальной ширине в 1320 пикселей, если пользователь откроет ваш сайт на большом мониторе, ваша верстка перестанет тянуться на весь экран и приобретет фиксированные размеры. В то же время, задание минимальной ширины позволит содержимому не уменьшиться настолько, что его уже просто невозможно будет читать.

Итак, всегда задавайте max-width, min-width вместо того, чтобы просто писать width, то есть фиксированную ширину. Ее можно прописывать непосредственно дочерним блокам, но никак не общим контейнерам. Это также закладывает адаптивность. Применив на пару с max-width пару медиа запросов можно сделать свой сайт адаптивным, что значительно улучшит его удобство для мобильных пользователей.