This site http://hausenterprises.net/home
In an ideal world, we would have a masthead for mobile, tablet, and desktop. It would also be great to have control of the tagline in the masthead. However, I understand this is not built in.
On this site I am trying to really tighten up the space between the masthead and row 1. I have used the CSS that is provided in some other threads on this site, removed the pading on the page layout, and adjust the Settings. I have also tried the custom CSS to remove the space before and after a header style. And, I have tried negative space. However, I cannot seem to tighten up the spaces between masthead, row 1, and row 2.
This is a significant issue on mobile. The logo and menu plus the tagline eat up half the screen. Hence the request for separate mastheads for different response sizes.
How can I tighten up this space?
How can I reduce the masthead size on mobile?
Thank you
Hi Paul,
Please open your tagline row by clicking the wrench icon above the row and head over to the row styles sidebar. Open the Layout settings group and set the lower if not remove (set it to 0) the mobile padding for the row. Do the same thing for the next row. how does that look?
As for the masthead. Try adding the following CSS to WP AdminAppearanceCustom CSS:
@media (max-width: 600px) { .logo { width: 45% !important; } .logo img { max-width: 100% !important; } }How does that look?
You might also need to install the SiteOrigin CSS Editor.