Space between header and body

  • Resolved abouchard62

    (@abouchard62)


    8 years, 8 months ago

    I am working with Maisha Lite and there is a large space between the header and the first entry on the front page. I have only taken an intro to web design class, so please forgive my shortcomings in describing/resolving the issue. I searched the forums and only saw one other similar issue which did not help me.

    The site can be found at:
    https://www.emergency-preparedness.org/

    When I use inspect element on the empty space, it highlights the following code which I cannot find anywhere:
    <article class=”post-104 page type-page status-publish hentry” id=”post-104″>

    Thank you!

Viewing 3 replies - 1 through 3 (of 3 total)
  • Thread Starter abouchard62

    (@abouchard62)

    So I added the following to Custom CSS:

    }
    #masthead {
    margin-bottom: -80px;
    }

    It appears to work but I thought that negative margins should not be used? Does anyone know? Thank you.

    It appears to work but I thought that negative margins should not be used? Does anyone know? Thank you.

    Nothing wrong with using negative margin. It is allowed and it is valid CSS. What should not be used is negative padding.

    Both the Mozilla Foundation & the W3C (the organization that defines teh standards of the web, such as HTML & CSS) say that negative margin is allowed. Here’s where they said it (read a few sentence down): [Mozilla] [W3C]

    .

    If you don’t want negative margins, you can remove your code with negative margin and add this instead, though this is a bit more complex:

    @media screen and (min-width: 59.6875em) {
    .hentry {
        padding-top: 0;
    }
}
    Thread Starter abouchard62

    (@abouchard62)

    @thepixelme

    I must be thinking of the negative padding. Thank you so much for your prompt response!

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘Space between header and body’ is closed to new replies.