margin-right in my body

[mojetevil]

Hello, I can not delete the right margin of my page, it is all with 100% width but the header and the footer (which have a fixed position) are wider, I attach capture. I wordk with Bootstrap 4 files

Regards

[dsonesuk]

Its a 15px padding and margin gutter, on each side, if you do not follow the way bootstrap uses these correctly spaces will appear because -15px margins make container wider than intended.

The other option is to produce a '.gutterless' class specifically for removing these when required.

[dlgalasso]

* {box-sizing:border-box} will fitt padding, margin and border in total width: raccomanded

* is universal selector so apply in each, if fixes bad on other pages belive you could just put it a new external or internal reference or even inline as just command.

Should work out

[mojetevil]

Thanks for the answers, but it does not work.

I have already tried everything, remove the bootstrap style padding, put the full width, remove the margins, create another class ... and the same thing keeps appearing, I do not know what can be

[dsonesuk]

If you use width: 100% on block elements with margin or padding, the total width will be 100% of parent element available width + margin and padding of this element.

Without access to this site, there's not much more we can suggest.

[mojetevil]

3 hours ago, dsonesuk said:

If you use width: 100% on block elements with margin or padding, the total width will be 100% of parent element available width + margin and padding of this element.

Without access to this site, there's not much more we can suggest.

http://pruebas.medac.es/landing1/index3.html

[dsonesuk]

First off, don't use container class on body, without it it will be 100% width, by default, also don't use deprecated center tags.

If you want a element  to be full width use container-fluid class, these container classes have padding either side of 15px, with a .row class within them, which has a -15px margin either side it will make this .row container same width as .container class, but! content will not go beyond padding.

IF you don't use .container classes without this padding and you use row class, because it does not have the same padding width to counteract -15px margin, these margin will extend beyond the 100% container width, larger than the browser width, so scrollbars will appear.

So like I mentioned before, use bootstrap as intended container classes outside, .row classes inside, OR create custommized .gutterless class (not part of bootstrap)

.gutterless, .gutterless > .row {
    margin: 0;
    padding: 0;
}

element texto-h2, and div elements without any class or container class with direct child elements using .row are the problem.

[dlgalasso]

Any outline to remove?

[mojetevil]

Thanks!! I solved it