Solved

Hide content container for specific section

Sebastian96
Excursionist
20 0 9

Hi,

 

I have set up a style for content containers in the theme settings, it looks great however on 1 speicific section I don't like the way it looks.

Sebastian96_0-1680510642876.png

This section can be found on the home page.

Is there a way to remove the grey borders for only this section?

Also I would like to make the images a bit bigger.

 

I am using Dawn theme 9.0.0

My website: https://egretta-shop.com/

Password: Egretta12345

 

Thanks in advance,

Sebastian

 

Accepted Solutions (5)

kazi
Shopify Partner
569 87 109

This is an accepted solution.

@Sebastian96 Hello

                                    add this css in base.css

 

.slider-mobile-gutter .content-container:after {
box-shadow: none;
}

 

.slider-mobile-gutter .multicolumn-card.content-container {
border: 0;
}

.multicolumn-card-spacing {
margin-left: 0.5rem !important;
margin-right: 0.5rem !important;
}

 

If you want more width of image you can increase container width from them settings

▶️ If you need more help with your Shopify store
Speed Optimization | Theme Customization ? ☎️ WhatsApp ✉️Email Skype: kof.bd

View solution in original post

zaczee
Globetrotter
848 46 42

This is an accepted solution.

HI @Sebastian96 ,

 

Add this CSS code
Online Store > Themes > Edit code > Assets > custom.css or theme.css

.multicolumn-card.content-container { border: none; }
.multicolumn-card.content-container:after { box-shadow: none; }

 

View solution in original post

Dan-From-Ryviu
Shopify Partner
7726 1504 1511

This is an accepted solution.

You can do that by adding this CSS code at the bottom of base.css and save file 

 

#shopify-section-template--17874775179528__multicolumn .content-container:after { box-shadow: none !important; }

 

Here is there result Screenshot 2023-04-03 at 16.01.48.png

 

- Helpful? Like and Accept solution or Buy me a coffee
- Ryviu - Product Reviews app, collect product reviews, import reviews from AliExpress, Amazon, Etsy, Shopee and Walmart and CSV.
- Lookfy app: Easy and fast to create Photo Gallery, Lookbook, Shop The Look
- Enjoy 1 month of Shopify for $1. Sign up now

View solution in original post

PageFly-Victor
Shopify Partner
7865 1785 3066

This is an accepted solution.

Hi @Sebastian96 

This is Victor from PageFly - Shopify Page Builder App, I’d like to suggest this idea:

 

Online Store ->Theme ->Edit code

Assets ->Base.css

.multicolumn-card.content-container { 
   border: none !important; 
}
.multicolumn-card.content-container:after { 
   box-shadow: none !important; 
}

Hope you find my answer helpful!

Best regards,

Victor | PageFly

View solution in original post

SAN_MSWEB
Shopify Expert
1105 131 137

This is an accepted solution.

Hi @Sebastian96 


I hope you are doing good and welcome to the Shopify Community!
I am San from MS Web Designer.

Please add this css in your bottom of the css file:

<style>

.multicolumn color-background-1 .multicolumn-card .multicolumn-card-spacing {margin: 0 !important; padding: 0 !important;}

</style>




Regards,

San

If it’s helpful to you, please mark it as a solution.  


Need Help with Shopify Design, Migration, Speed, or Custom tasks?  
email: hi@mswebdesigner.com
Try Our Conversion Booster app to get more sales | Connect Our Founder Linkedin

View solution in original post

Replies 6 (6)

kazi
Shopify Partner
569 87 109

This is an accepted solution.

@Sebastian96 Hello

                                    add this css in base.css

 

.slider-mobile-gutter .content-container:after {
box-shadow: none;
}

 

.slider-mobile-gutter .multicolumn-card.content-container {
border: 0;
}

.multicolumn-card-spacing {
margin-left: 0.5rem !important;
margin-right: 0.5rem !important;
}

 

If you want more width of image you can increase container width from them settings

▶️ If you need more help with your Shopify store
Speed Optimization | Theme Customization ? ☎️ WhatsApp ✉️Email Skype: kof.bd

zaczee
Globetrotter
848 46 42

This is an accepted solution.

HI @Sebastian96 ,

 

Add this CSS code
Online Store > Themes > Edit code > Assets > custom.css or theme.css

.multicolumn-card.content-container { border: none; }
.multicolumn-card.content-container:after { box-shadow: none; }

 

Dan-From-Ryviu
Shopify Partner
7726 1504 1511

This is an accepted solution.

You can do that by adding this CSS code at the bottom of base.css and save file 

 

#shopify-section-template--17874775179528__multicolumn .content-container:after { box-shadow: none !important; }

 

Here is there result Screenshot 2023-04-03 at 16.01.48.png

 

- Helpful? Like and Accept solution or Buy me a coffee
- Ryviu - Product Reviews app, collect product reviews, import reviews from AliExpress, Amazon, Etsy, Shopee and Walmart and CSV.
- Lookfy app: Easy and fast to create Photo Gallery, Lookbook, Shop The Look
- Enjoy 1 month of Shopify for $1. Sign up now

PageFly-Victor
Shopify Partner
7865 1785 3066

This is an accepted solution.

Hi @Sebastian96 

This is Victor from PageFly - Shopify Page Builder App, I’d like to suggest this idea:

 

Online Store ->Theme ->Edit code

Assets ->Base.css

.multicolumn-card.content-container { 
   border: none !important; 
}
.multicolumn-card.content-container:after { 
   box-shadow: none !important; 
}

Hope you find my answer helpful!

Best regards,

Victor | PageFly

Sebastian96
Excursionist
20 0 9

Thank you Everyone.

 

It works perfectly.

 

Best regards,

Sebastian

SAN_MSWEB
Shopify Expert
1105 131 137

This is an accepted solution.

Hi @Sebastian96 


I hope you are doing good and welcome to the Shopify Community!
I am San from MS Web Designer.

Please add this css in your bottom of the css file:

<style>

.multicolumn color-background-1 .multicolumn-card .multicolumn-card-spacing {margin: 0 !important; padding: 0 !important;}

</style>




Regards,

San

If it’s helpful to you, please mark it as a solution.  


Need Help with Shopify Design, Migration, Speed, or Custom tasks?  
email: hi@mswebdesigner.com
Try Our Conversion Booster app to get more sales | Connect Our Founder Linkedin