Как растянуть полосу?
Всем добрый вечер, возможно я задаю глупый вопрос, но все же задам: я делаю сайт по макету из Figma, внизу header я хочу растянуть эту полосу (фотка прикреплена, там полоса светлая) так, чтобы не было белых областей. Как мне это сделать? Вот отрывок кода HTML:
<section class="sectionpartners"> <div class="container"> <img src="img/partners.svg" alt="partners" img class="partners-img"> </div> </section> </body> </html> |
<section class="sectionpartners"> <div class="container"> <img src="img/partners.svg" alt="partners" img class="partners-img"> </div> </section> </body> </html>
Вот CSS:
.partners-img{ width: 100%; height: 100%; background-size: cover; background-repeat: inherit; background-position: center; } |
.partners-img{ width: 100%; height: 100%; background-size: cover; background-repeat: inherit; background-position: center; }
Дополнительно:
Тут написаны стили от какой-то контентной картинки с изображением партнеров.
Именно так читается написанный вами код.
А на макете я вижу просто bg color какого-то блока, если в нем есть содержимое или псевдоэлемента, если нет. Либо не bg color, а кусок градиента. Поскольку макет там обрывается, то кто же его знает что там ниже в макете.
Что делать:
1. Не складывать в контейнер то, что там неудобно держать.
2. Если всё таки нужно выйти за пределы контейнера и это гладкий фон, то прибить абсолютом к правой части блока, чтобы шел налево. Направо тенью. Так не будет прокрутки и не понадобится сомнительный overflow.
3. Либо абсолют по центру и overflow.
Но эти рецепты абстрактны. Потому что не видно всей задачи. Что это за полоса вообще? Что там дальше?
Может, это вообще тень от шапки...
Опишите проблему, и специалист поможет с настройкой, исправлением ошибки или доработкой сайта. Подберём понятный план работ без лишней переписки.
Пока нет других ответов. Будьте первым, кто поможет автору.
Ответить на вопрос
Для растягивания полосы на веб-странице можно использовать CSS. Существует несколько способов сделать это, в зависимости от того, какой именно вид полосы вам нужен - горизонтальный или вертикальный.
Для растягивания горизонтальной полосы на всю ширину экрана можно использовать следующий CSS код:
.stripe { width: 100%; }
В данном примере мы используем класс ".stripe" для элемента, который представляет собой полосу. Устанавливаем ширину этого элемента в 100%, что позволит растянуть его на всю доступную ширину экрана.
Если вам нужно растянуть вертикальную полосу на всю высоту экрана, вы можете использовать следующий CSS код:
.stripe { height: 100vh; }
Здесь мы также используем класс ".stripe" для элемента и устанавливаем его высоту в 100vh, что означает 100% высоты видимой области экрана.
Если вам нужно растянуть полосу только по одной из осей (горизонтальной или вертикальной), вы можете использовать сочетание указанных выше методов, устанавливая только ширину или только высоту элемента.
Надеюсь, это поможет вам решить вашу проблему с растягиванием полосы на веб-странице. Если у вас возникнут дополнительные вопросы, не стесняйтесь задавать.