How to reduce white space / margin / padding?

  • Hi,

    I am trying to reduce the white space / margin around the text box on my homepage.

    The homepage is: https://marieteather.com/

    Beneath the header image is some latin text. (I think it is the div.intro-text h1 ?)

    How do I reduce the margin around the text, so it is closer to the image above and the text below, please?

    Thanks!

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

Viewing 5 replies - 1 through 5 (of 5 total)
  • Thread Starter marieteather

    (@marieteather)

    (The Latin text is now my intro text.)

    Hey Marie,

    There are multiple solutions detailed at Mastering Margin Collapsing but here is a quick and easy one. Simply apply a little padding to the containers to contain any child element margins.

    I hope that will work for you.

    Thank you

    Thread Starter marieteather

    (@marieteather)

    How do I do that?

    Thread Starter marieteather

    (@marieteather)

    Hi,

    Could someone make this clearer, please.

    Thanks

    Marie

    Try this –
    .entry-container,
    .widget,
    #supplementary .wrapper,
    #supplementary .widget {
    padding-top: 0;
    padding-bottom: 0;
    }

    OR ===

    1) Clear the margin from h1, h2 and p

    header h1,
    header h2,
    section p,
    footer p {
    margin: 0;
    }

    2) Now apply an overflow setting to the containers header
    header,
    footer,
    section {
    overflow: auto;
    }

    3)now we can add border/padding to the containers
    header,
    footer,
    section {
    padding: 1px;
    }

    • This reply was modified 6 years, 5 months ago by Vibha Tiwari.
    • This reply was modified 6 years, 5 months ago by Vibha Tiwari.
Viewing 5 replies - 1 through 5 (of 5 total)
  • The topic ‘How to reduce white space / margin / padding?’ is closed to new replies.