Get rid of white space between Image banner and Featured collection

[crobinsonrauch]

 

Hello , I would like to remove all the white space boarders in the circled places. I also want the 3 featured products to stretch to reach the image banner width.  I want the images to bleed into each other, to replicate like this website design:

Can you give me step by step instructions on how to do this? I am using DAWN theme is there a better/different theme I should be using? 

Thank you!

[Bluesoft_Design]

Hi @crobinsonrauch ,

Can you share a link to your site?

[crobinsonrauch]

https://crobinson-4030.myshopify.com/

[Bluesoft_Design]

The site is password protected. Can you share the password to enter the site?

[crobinsonrauch]

JStrongwater123

[Bluesoft_Design]

From what I can see, it looks like that 2nd grid of 3 images is no longer there anymore.

[AvadaCommerce · Accepted solution]

Hi @crobinsonrauch ,

You can follow the instruction below:

1. Go to Online Store->Theme->Edit code
2. Asset->/base.css->paste below code at the bottom of the file:

#shopify-section-template--14441365995556__featured_collection .collection {
    padding: 0 !important;
}

#shopify-section-template--14441365995556__featured_collection .grid {
    column-gap: 0 !important;
    row-gap: 0 !important;
    margin: 0 !important;
}

@media (min-width: 990px) {
#shopify-section-template--14441365995556__featured_collection .grid .grid__item {
    width: calc(100% / 3) !important;
    max-width: calc(100% / 3) !important;
}
}

If you feel like my answer is helpful, please mark it as a SOLUTION. Let me know if you have any further questions.