What's your biggest current challenge? Have your say in Community Polls along the right column.

Re: ZERO the Margin on the Dawn theme for a Custom Liquid Section

ZERO the Margin on the Dawn theme for a Custom Liquid Section

DominantGraph
Tourist
6 0 1

Greetings Gurus, I'm using a Custom Liquid Section on my index page and simply want to ZERO the Margin to eliminate the gaps above and below.
Please advise

DominantGraph_0-1634573860581.png

 

{%- if template.name == 'index' -%}
  <h1 itemscope itemtype="http://schema.org/Organization">
{%- else -%}
  <div itemscope itemtype="http://schema.org/Organization">
{%- endif -%}

  <a href="/" itemprop="url">
    <img src="{{ "logo.svg" | asset_url }}"
      alt="{{ shop.name }}"
      itemprop="logo">
  </a>

{%- if template.name == 'index' -%}
  </h1>
{%- else -%}
  </div>
{%- endif -%}

  

Replies 12 (12)

Zworthkey
Shopify Partner
5581 642 1583

@DominantGraph 
by Using margin and padding you can remove the gap. 
Thank you.

DominantGraph
Tourist
6 0 1

Please elaborate a bit.

Zworthkey
Shopify Partner
5581 642 1583

like margin-top:10px;
padding-bottom:20px;
or
@DominantGraph 
Kindly share your Site url. so i can help you.

DominantGraph
Tourist
6 0 1

This is the site: https://inevitabilitee.myshopify.com

the code is testing

It's the firts image at the top. Where do I put the code you mentioned?

like margin-top:10px;
padding-bottom:20px;

I'm a newbie

Zworthkey
Shopify Partner
5581 642 1583

Store is password protected.

DominantGraph
Tourist
6 0 1

the code is testing

Zworthkey
Shopify Partner
5581 642 1583

Hii, @DominantGraph 
Paste this code on top of the base.css file.

section#shopify-section-template--15272167112939__1634552218f637ba57 h1 {
    margin-top: -70px !important;
}

Thank You.

DominantGraph
Tourist
6 0 1

Thanks for your help, that snippet took care of the margin but broke a lot of other things!
It removed the 'Welcome to our store' section and screwed up the header margin.
It also removed the shading from the lower sections.

DominantGraph_0-1634577518716.png

Original (I only want that white gap gone where the red arrow is.

DominantGraph_1-1634577590560.png

 

 

Zworthkey
Shopify Partner
5581 642 1583

Hii, @DominantGraph 
Paste this code on top of the base.css file.

section#shopify-section-template--15272167112939__1634552218f637ba57 {
    margin-top: -35px !important;
}

Thank You.


DominantGraph
Tourist
6 0 1

That's not working either "-35" Breaks other things and removes the welcome section at the top.

dmwwebartisan
Shopify Partner
12323 2552 3732

@DominantGraph 

Please share your store URL.

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

Gouldney
Visitor
1 0 0

In you section custom_liquid.liquid file swap out this code 

@media screen and (min-width: 750px) { .section-{{ section.id }}-padding { padding-top: {{ section.settings.padding_top }}px; padding-bottom: {{ section.settings.padding_bottom }}px; } }

for this one


@media screen and (min-width: 750px) {
.section-{{ section.id }}-padding {
padding-top: 0;
padding-bottom: 0;
}
}