Add these 2 lines to your CSS:
1.
body {
...
overflow-x: hidden;
}
header {
...
background-size: cover;
}
Solution 1 :
Solution 2 :
Your div with classes cuerpoHeader, row is not wrapped in bootstrap container and is overflowing and thus stretching the page. If you wrap it inside of
<div class="container"></div>
the problem will disappear
Solution 3 :
I’m assuming you’re referring to the Background Image? As there looks to be a gap on the right where the image isn’t showing.
Assuming this…
Basically
- Make your image bigger (like 2000px wide as that tends to cover most monitors, excluding larger things like TVs)
- Add to your CSS
background-position: centerthen that is probably going to cover you for the majority of use cases
If what I’ve said above isn’t what you’re looking for. Basically apply this CSS to the relevant section of the page width:100% and that will cover off the majority of weird issues.
Problem :
It never happenned to me, but there is a small blank space on the right, what could it be?
Comments
Comment posted by MalwareMoon
Setting overflow-x: hidden; in body does not solve the problem with overflowing element, just hides it. That header part of it is accurate if the goal was to make the background image full size.
Comment posted by DeWittz
Thank you so much!! the gap reduced, but still there is a tiny almost imperceptible gap, what could it be?