Css ширина выше 100%

Ответ 1

Да, согласно спецификации CSS 2.1, все неотрицательные значения действительны для ширины, которая включает в себя процентные значения выше 100%.

Ответ 2

Процентные значения просто представляют собой процент от длины контейнера элементов. Процент более 100% полностью действителен, однако процент менее 0% не равен (поскольку 0% всегда будет равно длине 0).

Скажем, у вас есть элемент div, который имеет ширину 100 пикселей. Внутри этого элемента div есть элемент p, на который вы устанавливаете процентную ширину, произойдет следующее:

width: 0%;                         // 0px (0% of 100px)
width: 10%;                        // 10px (10% of 100px)
width: 100%;                       // 100px (100% of 100px)
width: 110%;                       // 110px (110% of 100px)
width: 200%;                       // 200px (200% of 100px)
width: 1000%;                      // 1000px (1000% of 100px)

Из W3 Уровень и единицы измерения CSS-уровня 3::

Процентное значение обозначается <percentage>, состоит из <number>, за которым следует знак процента '%. Это соответствует маркеру PERCENTAGE в грамматике.

Процентные значения всегда относятся к другому значению, например, к длине. Каждое свойство, которое позволяет проценты, также определяет значение, на которое указывает процент. Значение может быть значением другого свойства для того же элемента, свойства для элемента предка или значения контекста форматирования (например, ширины содержащего блока). Когда задано значение процента для свойства корневого элемента, а процент определяется как относящийся к унаследованному значению некоторого свойства, результирующее значение представляет собой процентное значение, умноженное на начальное значение этого свойства.