a) why not specifying your #slides
in the .slide
class?
b) You can't get relative behaviour with absolute widths. Use relative widths.
example:
.postWid {
width: 100%;
max-width: 1240px;
margin: 0 auto;
}
Вопрос
So frustrated with this issue. I'm not sure what the issue is. I'm trying to get this background on this website to stretch the full width of the background. The issue comes into play when the window size is reduced. Below is the code.
HTML
<section id='slide1' class='slide slide-odd'>
<div class="postWid">
<div class='row'>
<div class='col-lg-7'></div>
<div class='col-lg-5'>
</div>
</div>
</div>
</section>
CSS
#slide1,
#slide2,
#slide3,
#slide4,
#slide5,
#slide6,
#slide7,
#slide8,
#slide9,
#slide10,
#slide11,
#slide12,
#slide13,
#slide14,
#slide15,
#slide16 {
height: 480px;
}
.slide-odd {
background: url('../img/green.png');
background-color:#408573;
color:#ffffff;
}
.slide-even {
background: url('../img/white.png');
background-color:#f4f0e7;
color:#000000;
}
.slide {
padding: 144px 3%;
}
.postWid {
width: 1240px;
margin:0 auto;
}
I think it has to do with .postWid I set it to min and max widths but it isn't responding to the min width. So I had to set the width to 1240px;
Решение
a) why not specifying your #slides
in the .slide
class?
b) You can't get relative behaviour with absolute widths. Use relative widths.
example:
.postWid {
width: 100%;
max-width: 1240px;
margin: 0 auto;
}