How can I fix the large spacing between header and Title on Mobile version?

  • Hi,

    Just doing some tweaks to the home page and noticed that the spacing between the navigation menu and the page Title of “Hello World” looks great on a laptop or regular screen but on a mobile phone there is a large space between them.

    Is there anything I can do to help fix this? Or would I be able to place a header image or Logo there which might be better actually?..:)

    Thanks very much in advance for any help with this..

    • This topic was modified 4 years, 9 months ago by neptune1.

    The page I need help with: [log in to see the link]

Viewing 3 replies - 1 through 3 (of 3 total)

  • to reduce the space on mobiles, try to add this via ‘Additional CSS’:

    .page-template-template-homepage:not(.has-post-thumbnail) .site-main {
  padding-top: 0.63em; }
@media (min-width: 768px) {
  .page-template-template-homepage:not(.has-post-thumbnail) .site-main {
    padding-top: 4.23em; }
}

    this keeps the large space on wider screens but reduces it on mobile phones.

    you could try experimenting with adding featured images to the posts…

    Thread Starter neptune1

    (@neptune1)

    Great thank you Michael! I will give that a try today! thanks again!

    Thread Starter neptune1

    (@neptune1)

    That definitely helped thanks again…

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘How can I fix the large spacing between header and Title on Mobile version?’ is closed to new replies.