CSS — Меняем ширину

CSSВсем привет! В этой небольшой статье мы с вами научимся менять ширину блоков через CSS. В дизайне без настройки ширины не обойтись. Думаю новичкам будет полезен данный пост.

Меняем ширину через CSS

Для того, чтобы поменять ширину блока используется свойство width (ширина). Оно указывается в пикселях или процентах. Допустим у нас есть блок, который принадлежит к классу .someclass

Для того, чтобы поменять ширину блока в css…

Этот блок имеет свойство width: 50%

Соответственно 50% означает, что блок растягивается исключительно на 50% от родительского в котором он находится, если быть точнее, то на 50% ширины блока в котором находится данная статья.

Давайте поменяем ширину блока в пикселях. Например, установим параметр 300px:

Для того, чтобы поменять ширину блока в css…

Как видите, в пикселях гораздо сложнее рассчитать расстояние, которое должен занимать ваш блок.

Свойство width имеет еще разновидности max-width и min-width. Max-width устанавливает максимальную ширину настраиваемого блока, min-width — минимальную. Соответственно при выставленных параметрах, свойство width будет обретать либо максимальную, либо минимальную величину в зависимости от количества контента внутри блока и размеров экрана, но никогда не выйдет за рамки максимальных и минимальных настроек.

P.S. В этом году я постараюсь лить меньше воды, и давать побольше полезной информации. На этом все! Подписывайтесь на группу ВК и ютубчик!

Лицензионное соглашение

Авторские права публикуемых материалов полностью или частично принадлежат авторам сайта Pechenek.NET в соответствии со статьями 1252 и 1301 ГК РФ. Любое распространение должно быть согласовано с автором материала или с указанием ссылки на первоисточник.