I am using the bootstrap4 theme but there are margins on each side of the page. Is it possible to make bigger content like images fill the entire width of the page? I tried width=100% but it just filled the container.
@chatterannex, It requires a bit of knowledge about Bootstrap’s v4 and especially its grid system and containers.
Not sure if it will fit your needs, but you might try class="container-fluid"
which uses a 100% width.
Thank you for your response. I have already tried that but it still has the margins. I am looking to make it stretch across the entire screen. It works fine in a regular webpage but with grav there is some sort of container that the main contents are put in which causes them to not fill the page.
@chatterannex, That hasn’t got much to do with Grav, but rather how the Bootstrap v4 itself works and how theme Bootstrap4 uses it.
Everything inside a container
/container-fluid
will have a padding-right
and padding-left
. Unless you remove/change the padding-left
, padding-right
inside _grid.scss
Content without some padding would be very awkward imho.
If you want for example a hero image from egde to edge, you need to place it outside any type of container, for which you’ll have to edit the Twig template(s).
According the Bootstrap v4 docs:
Need an edge-to-edge design? Drop the parent
.container
or.container-fluid
.