Wide grey bar at the top of pages

Hi: Can you please help me to reduce the depth of the horizontal grey bar that appears along the top of all new pages? I see it here on this site at the top, where it says Shapely. On my site it is about 4 times as deep as this and it takes up a lot of space.

Thanks for any help in making this bar thinner!

Joan

Sorry, I forgot to post a link to my site: http://doggiedetectiveforkids.com

Hey there,
Hope you’re doing well today

Kindly add and save the following code to Appearance > Customize > Additional CSS:

.page-title-section{
  height:55px!Important;
}

Please let me know if this helps.

Best Regards,
Support

Thanks for the tip. I tried that, but there is still a big bar. I tried using 10 px instead of 55, but it didn’t change. Please see screen shot. Do you have any other suggestions?

Thanks for you help!

Joan

Hi Joan,

I had the same problem with my site. I had success fixing it by adding the following code to “additional CSS”:

.page-title-section{ height:10px!Important; padding-top:10px; padding-bottom:10px; }

Adjust the pixels for padding-top and padding-bottom to make it as tall or short as you want. Hope that helps!

Laura

Thanks Laura and Support! It’s fixed now. So grateful!
Joan

Hey @joanorr,

Did you get the issue sorted out?

Please let me know so that I may provide some further assistance if needed.

I look forward to your reply :slight_smile:

Best Regards,
Support

Yes - see a previous reply. Thanks so much for your speedy help!

Joan

Hey @joanorr,

I am glad the solution worked for you.
Please feel free to contact us again in the future regarding any other issues.

Best Regards,
Support