Make content full width on Jasper template

Site URL: http://www.studiowilson.co.nz

Hi there,

I'm trying to make the content of my Index and pages full width like the collection images in my portfolio - www.studiowilson.co.nz

I'm using the Jasper template and I managed to get the footer max width 100% but can't get the rest of the content to match.

Any ideas? Thanks!

34 minutes ago, mmmbakes said:

Site URL: http://www.studiowilson.co.nz

Hi there,

I'm trying to make the content of my Index and pages full width like the collection images in my portfolio - www.studiowilson.co.nz

I'm using the Jasper template and I managed to get the footer max width 100% but can't get the rest of the content to match.

Any ideas? Thanks!

Try adding to Home > Design > Custom Css

#collection-header-57a9b0b7d482e9bbf17908a1 > .row {
  margin: 0;
}

Let me know how it works on your site

My testing

23 minutes ago, bangank36 said:

Try adding to Home > Design > Custom Css

#collection-header-57a9b0b7d482e9bbf17908a1 > .row {
  margin: 0;
}

Let me know how it works on your site

Thanks so much, but for some reason at my end this nudged the content in a little, and didn't align content left.. I tried adding !important; to this but it didn't help.

Any thoughts? I'm wondering if there is something overriding this? 

1 hour ago, mmmbakes said:

Thanks so much, but for some reason at my end this nudged the content in a little, and didn't align content left.. I tried adding !important; to this but it didn't help.

Any thoughts? I'm wondering if there is something overriding this? 

Try adding to Home > Design > Custom Css

#block-60715486e3a7645e266a  {
  padding: 0;
}

#collection-header-57a9b0b7d482e9bbf17908a1 {
  margin: 0 !important;
}

Let me know how it works

7 minutes ago, bangank36 said:

Try adding to Home > Design > Custom Css

#block-60715486e3a7645e266a  {
  padding: 0;
}

#collection-header-57a9b0b7d482e9bbf17908a1 {
  margin: 0 !important;
}

Let me know how it works

Amazing thank you!!

Would you know how I make the individual page content/collections full width too? 
At the moment they've got a too much padding. I tried the above for the collection margin but it didn't seem to work.

4 hours ago, mmmbakes said:

Amazing thank you!!

Would you know how I make the individual page content/collections full width too? 
At the moment they've got a too much padding. I tried the above for the collection margin but it didn't seem to work.

Can you share the url for this page?

On 2/8/2022 at 6:26 PM, bangank36 said:

Can you share the url for this page?

https://www.studiowilson.co.nz/methven-vjet

2 hours ago, mmmbakes said:

https://www.studiowilson.co.nz/methven-vjet

Try adding to Home > Design > Custom Css

.show-collection-page-header .collection-header {
  max-width: unset;
}

Let me know how it works on your site 

Support me by pressing 👍 if this useful for you