How to remove white space below title/date in blog posts? (Brooklyn Theme)

[LisanneH]

Hi!

I hope someone can help me with reducing this white space in between the date and the body text in all my blog posts. 

Thanks in advance!

[LisanneH]

Here's a blog example: https://mydigitalpet.com/blogs/articles/astrological-guide

But someone posted the solution already. Thank you so much anyway!

[Made4uo-Ribe · Accepted solution]

Hi @LisanneH 

Try this one. 

• From your Shopify admin dashboard, click on "Online Store" and then "Themes".
• Find the theme that you want to edit and click on "Actions" and then "Edit code".
• In the "Assets" folder, click on "base.css, style.css or theme.css" file, depending on which file your theme uses to store its CSS styles. At the bottom of the file, add the following CSS code:

header.section-header.text-center {
    margin-bottom: 0px;
}

• And Save. 
• Result:
• 
• Let me know if you need more lesser space. 

I hope it help. 

Please don't forget to Like and Mark Solution to the post that helped you. Thanks!

[LisanneH]

It worked! Thank you so much!

[DelightCart]

@LisanneH Please send me store url.

[LisanneH]

Here's a blog example: https://mydigitalpet.com/blogs/articles/astrological-guideBut someone posted the solution already. Thank you so much anyway!

[RockTechnolabs]

Hi @LisanneH  To remove this space you have to add the below code in the theme.scss.css file Located in the asset folder in the theme code.

@media screen and (min-width: 591px){

#shopify-section-article-template .section-header {

    margin-bottom: 0 !important;

}

}

.section-header .date:last-child {

    margin-bottom: 0px !important;

}

Yes.! You have to add the important cause we are overring the default CSS. it's Completely file to add important On CSS

[LisanneH]

The first reaction of @Made4uo-Ribe worked! Will this code turn out differently or the same?

[RockTechnolabs]

Hey @LisanneH  It's more likely the same but my code is more accurate.

[Made4uo-Ribe]

Hi, I dont like to interfer. But just to clarify it to you this code is for mobile screen. 😅

[RockTechnolabs]

@LisanneH just remove the  

@media screen and (min-width: 591px){}
and we are good to go