Наклонные полосы на страницеCSS

Разбираемся в CSS
Ответить
Anonymous
 Наклонные полосы на странице

Сообщение Anonymous »

Мне хотелось бы, чтобы на странице были полноразмерные наклонные полосы; вот и все.
Вот что я сделал до сих пор:

Код: Выделить всё

html, body {
overflow-x: hidden;
margin: 0;
padding: 0;
}
body {
display: flex;
margin: 0;
padding: 0;
}

.flag-strip {
position: absolute;
width: 100vw;
height: 15px;
left: 0;
transform: rotate(-10deg);
z-index: 1;
}

.flag-strip.red {
background-color: #D90012;
top: 9%;
}

.flag-strip.blue {
background-color: #0033A0;
top: 10.5%;
}

.flag-strip.orange {
background-color: #F2A800;
top: 12%;
}

@media (max-width: 878px) {
.flag-strip.red {
top: 11%;
}

.flag-strip.blue {
top: 12.5%;
}

.flag-strip.orange {
top: 14%;
}
}


Но у пользователя не должно быть горизонтальной полосы прокрутки и полосок должен быть действительно полноразмерным — на странице не должно быть видимых окончаний.
Как я могу заставить это работать так?

Подробнее здесь: https://stackoverflow.com/questions/793 ... -on-a-page
Ответить

Быстрый ответ

Изменение регистра текста: 
Смайлики
:) :( :oops: :roll: :wink: :muza: :clever: :sorry: :angel: :read: *x)
Ещё смайлики…
   
К этому ответу прикреплено по крайней мере одно вложение.

Если вы не хотите добавлять вложения, оставьте поля пустыми.

Максимально разрешённый размер вложения: 15 МБ.

Вернуться в «CSS»