How to minimize the gap between two section on homepage

Store Design
1

Hi,

How i can decrease the gaping on homepage desktop.

URL - www.portronics.com

tododlist 2.PNG
tododlist 2.PNG1365×641 27.7 KB

Todod list 1.PNG
Todod list 1.PNG1350×636 133 KB

1 Like
2

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;
}
}
1 Like
3

@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!

2 Likes
4

Hi @dmwwebartisan @Kinjaldavra

Thanks it worked.

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

URL- www.portronics.com

todo 3.PNG
todo 3.PNG1342×558 176 KB

1 Like
5

@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;
}
}
1 Like
6

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

7

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;
}
}