How to Reduce the size of top bar on mobile site

How to Reduce the size of top bar on mobile site.

My website is

and the screenshot is http://techconnecto.com/

Hello @sksalvatore,

Please try to use the following CSS code.

You can add CSS code in Dashboard → Appearance → Customize → Additional CSS (WordPress 4.7 and up).

@media (max-width: 767px) {
    #masthead .site-branding.vhome3 {
        padding-top: 8px;
        padding-bottom: 0;
    }
}

Kind Regards, Roman.

@Roman I did try this code but nothing happened and there is still a huge space at the top of the social icons.

Hello @sksalvatore,

It’s because there is empty Latest News area. You can configure Latest News area in Dashboard → Appearance → Customize → Header area → Latest news section.

Also you can hide Latest News area using CSS code, please leave here a note if you want to do it.

Kind Regards, Roman.

@Roman Thanks. And yes I would like to remove the empty latest news area using css.

Okay @sksalvatore,

Please try to use this CSS code in order to hide (not remove) the Latest News area:

.media.breaking-news {
    display: none;
}

Kind Regards, Roman.

@Roman Thanks. It worked you’re awesome.

You are welcome @sksalvatore! And have a nice day :slight_smile:

Kind Regards, Roman.