Removing space on Homepage btw Header and slideshow

Store Design
1

Hi,

There is an unwanted space between at my homepage. Between the Header and Slideshow image.

My store URL is https://huginabox.ie/

Please help me to remove this from both desktop and mobile views. Thanks

UsmanAi_0-1647789151381.png
UsmanAi_0-1647789151381.png1816Ă—1580 185 KB

2

Hello @AislingOd ,

.main-content {
    padding: 0 !important;
}
.index-section {
    padding: 0 !important;
}

Add this css at the bottom of file theme.css, you can find this file under assets.

Thanks

3

I read this in previous discussion forum. Also I tried this but doesnt seem to work.

4

Sounds strange, I inspect your store and provide css accordingly.
btw try this one
In you theme files search for this css and remove it

.main-content {
    padding-top: 35px;
}
.index-section {
    padding-top: 35px;
}
@media only screen and (min-width: 750px){
.main-content {
    padding-top: 55px;
}
.index-section {
    padding-top: 55px;
}
}
5

Hello @AislingOd

just add this css code to remove unwanted space between header and slider

@media only screen and (min-width: 750px){
body.template-index #MainContent, #shopify-section-hero-1{
padding-top:0px !important;
}
}

6

I have tried all but still unable to resolve this issue.

7

Hi @AislingOd ,

You can follow the instruction below:

  1. Go to Online Store->Theme->Edit code
    2.Find file “theme.liquid”->Find and paste below code at the before “”:
.template-index #shopify-section-hero-1, .template-index .main-content {
    padding-top: 0 !important;
}

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

8

Hello @AislingOd

i understand your concren.

would you like to give me your store access so i can fix it for you.
Thanks

9

@AislingOd you can try this code in your cs file if it didn’t worked then you can try it by putting in index file

@media only screen and (min-width: 750px){
.main-content {
    padding-top: 0px !important;
}
.index-section {
    padding-top: 0px !important;
   }
}
.main-content {
    padding-top: 0px !important;
}
.index-section {
    padding-top: 0px !important;
}
10

Yes please

support@huginabox.ie
Odonoghue@72

11

@AislingOd

add this code to your theme.liquid file.

Navigate to online store >> Click edit theme code.

Now find theme.liquid and paste the following code on the top:
1 Like
12

Thanks alot @eFoli-Marvic Brilliant.

13

Hey @eFoli-Marvic I was just wondering how can we do the same for mobile view. Because the mobile view is still having some space on the top.

UsmanAi_0-1648649239110.png
UsmanAi_0-1648649239110.png617Ă—278 96.1 KB

14

Hi @AislingOd,

I’m having a shopify dawn store and I’m facing same problem, means white space between header and slideshow (both in pc and mobile view).

White portion between header and slideshow.jpg
White portion between header and slideshow.jpg981Ă—163 15.7 KB

Could you please help me out

Thanks,

@deb007