@StasTih

Немогу понять почему сайт вылазеет за пределы установленной широты?

Верстал сайт размером 1920px, когда он был готов открыл его не в панели разработчика, а в обычном окне браузера с разрешением в 100%, после этого он начал отображаться неправильно, блоки выстроились в ряд как в адаптиве, а картинка сильно увеличилась. Не могу понять, почему так?
  • Вопрос задан
  • 69 просмотров
Пригласить эксперта
Ответы на вопрос 2
@GrinchCreator
position какой-то задан?
Пришли пример html и css
Ответ написан
Комментировать
@StasTih Автор вопроса
63d41036933f2918236191.png

-----------------------------------------------------------CSS-----------------------------------------------------
/*--------------------------------------advantages----------------------*/
.advantages{
margin-bottom: 150px;
position: relative;
}
.advantages__block{
position: relative;
max-width: 590px;
margin: 0 auto;
margin-bottom: 74px;
}
.advantages__block::after{
position: absolute;
content: '';
right: -355px;
top: -112px;
background-image: url(../images/advantages.png);
background-repeat: no-repeat;
width: 300px;
height: 300px;
background-size: 320px;
z-index: 2;
}
.advantages__block-title{
text-align: center;
font-size: 50px;
line-height: 121%;
color: #000000;
position: relative;
}
.advantages__block-title::after{
position: absolute;
content: '';
width: 100%;
height: 4px;
background-color: #D5E334;
box-shadow: 6px 6px 10px #D5E334;
left: 0px;
top: 60px;
}
.advantages__content{
padding: 0px 25px;

}
.advantages__item-wrapper{
display: flex;
justify-content: space-between;
gap: 0px 50px;

}
.advantages__item{
position: relative;
margin-bottom: 15px;
}
.advantages__box{
position: relative;
z-index: 3;
text-align: center;
top: 20%;
width: 910px;
height: 375px;
}
.advantages__box-title{
font-size: 35px;
line-height: 122%;
color: #FFFFFF;
margin-bottom: 20px;
}
.advantages__box-subtitle{
font-size: 25px;
line-height: 123%;
color: #FFFFFF;
}
.advantages__photo{
position: absolute;
width: 100%;
height: 100%;
top: 0;
left: 0;
}
.advantages__photo-img--mod2{
display: none;
}
._container {
max-width: 1920px;
padding: 0px 25px;
margin: 0px auto;
box-sizing: content-box;
}
.main {
flex: 1 1 auto;
}
._ibg {
position: relative;
}
._ibg img {
position: absolute;
width: 100%;
height: 100%;
top: 0;
left: 0;
object-fit: cover;
}
/*--------------------------------------advantages----------------------*/
Ответ написан
Комментировать
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы