The homepage image that you’re targeting to make it full-width is actually inside of a .container class and the .container class is using 1170px as it’s maximum width.
However, if you’d really like to make the homepage image to cover the full width, you’ll need to use the following CSS:
.home .container {
width: 100%;
padding: 0;
}
Notice that I’ve added the .home class for you which will only make the image wider on the homepage. If you’d like you can remove the .home class from the provided CSS which will affect on all of your pages.
Andrew Nevins
(@anevins)
WCLDN 2018 Contributor | Volunteer support
In the “Additional CSS” part of the dashboard add this:
.home .site-main .container {
padding: 0;
width: auto;
}
.home .site-main .container .row {
margin: 0;
}
.home .site-main .container .col-md-12 {
padding: 0;
}
https://codex.wordpress.org/CSS#Custom_CSS_in_WordPress
In future you should contact your theme author for support, as they will have the proper solution. The solution I’ve given breaks the grid layout for the homepage, which isn’t a great approach.
https://themeforest.net/user/rootlayers/
Thank you! That has helped with the image reaching the sides however how do I get rid of the white space at the top and bottom of the image? Thank you!!
