Solved

How to minimize the gap between two section on homepage

Shivam97
Trailblazer
165 0 63

Hi,

How i can decrease the gaping on homepage desktop.

URL - www.portronics.com

tododlist 2.PNGTodod list 1.PNG

Accepted Solutions (2)

Kinjaldavra
Shopify Partner
2302 570 1422

This is an accepted solution.

hello @Shivam97 


please Go to Online Store->Theme->Edit code then go to assets/theme.css ->paste below code at the bottom of the file.

@media screen and (min-width: 729px){
#shopify-section-160689169571201177 .index-section  , #shopify-section-1604877466457a2e04 .index-section .index-section--alt  {
	padding-top:  12px !important;
	padding-bottom:  12px !important;
}
}

 

View solution in original post

dmwwebartisan
Shopify Partner
12280 2546 3693

This is an accepted solution.

@Shivam97 

Please add the following code at the bottom of your assets/theme.css file.

@media only screen and (min-width: 769px){
.index-section--alt {
    padding: 50px 0 !important;
}
#shopify-section-1604877466457a2e04 .custom-content{
margin-top: -65px;
}
}

Hope this works.

Thanks!

If helpful then please Like and Accept Solution | Email: dmw.webartisan@gmail.com |  Instagram: @dmw.webartisan
Check here PageFly App to customize your pages | #1 Product Filter & Search app on Shopify | The most powerful Shopify page builder app

View solution in original post

Replies 6 (6)

Kinjaldavra
Shopify Partner
2302 570 1422

This is an accepted solution.

hello @Shivam97 


please Go to Online Store->Theme->Edit code then go to assets/theme.css ->paste below code at the bottom of the file.

@media screen and (min-width: 729px){
#shopify-section-160689169571201177 .index-section  , #shopify-section-1604877466457a2e04 .index-section .index-section--alt  {
	padding-top:  12px !important;
	padding-bottom:  12px !important;
}
}

 

dmwwebartisan
Shopify Partner
12280 2546 3693

This is an accepted solution.

@Shivam97 

Please add the following code at the bottom of your assets/theme.css file.

@media only screen and (min-width: 769px){
.index-section--alt {
    padding: 50px 0 !important;
}
#shopify-section-1604877466457a2e04 .custom-content{
margin-top: -65px;
}
}

Hope this works.

Thanks!

If helpful then please Like and Accept Solution | Email: dmw.webartisan@gmail.com |  Instagram: @dmw.webartisan
Check here PageFly App to customize your pages | #1 Product Filter & Search app on Shopify | The most powerful Shopify page builder app
Shivam97
Trailblazer
165 0 63

Hi @dmwwebartisan @Kinjaldavra 

Thanks it worked.

Can you please help me to increase little gapping below banner.

URL- www.portronics.com

todo 3.PNG

dmwwebartisan
Shopify Partner
12280 2546 3693

@Shivam97 

Please add this code for this.

@media only screen and (min-width: 769px){
div#shopify-section-1543003878234 .page-width .skrim-grid .skrim__item {
padding-top: 35px;
}
}

 

 

If helpful then please Like and Accept Solution | Email: dmw.webartisan@gmail.com |  Instagram: @dmw.webartisan
Check here PageFly App to customize your pages | #1 Product Filter & Search app on Shopify | The most powerful Shopify page builder app
Shivam97
Trailblazer
165 0 63

I added the code in CSS, but i cant see the change somehow @dmwwebartisan 

Kinjaldavra
Shopify Partner
2302 570 1422

hello @Shivam97 

please Go to Online Store->Theme->Edit code then go to assets/theme.css ->paste below code at the bottom of the file.

 

@media screen and (min-width: 729px){
#shopify-section-1543003878234 .index-section.index-section--alt{
padding: 110px 0!important;
}
}