• Resolved dionweston

    (@dionweston)


    I have created a child theme of Twenty Twelve to work with; https://codex.www.ads-software.com/Child_Themes

    and I have used Firebug to focus the spotlight on the CSS that relates to the white space areas I’d like to remove which is as follows:

    <article id="post-14" class="post-14 page type-page status-publish hentry">
    <header class="entry-header">
    <h1 class="entry-title">Home</h1>
    </header>
    <div class="entry-content">
    <h2>Tel: 0207 209 2867</h2>
    <p style="text-align: left; margin-top: 0px;">
    <p style="margin-bottom: 0px;">
    <ul style="margin-top: 0px;">
    <p style="margin-bottom: 0px;">
    <ul style="margin-top: 0px;">
    <p style="margin-bottom: 0px;">
    <ul style="margin-top: 0px;">
    <li>NW1 – Camden Town, Euston</li>
    <li>NW6 – West Hampstead, South Hampstead</li>
    <li>NW8 – St John’s Wood, Primrose Hill</li>
    <li>NW3 – Belsize Park, Hampstead, Chalk Farm, Swiss cottage</li>
    <li>N6 – Highgate</li>
    </ul>
    </div>
    <footer class="entry-meta"> </footer>
    </article>

    The white spaces I wish to remove are highlighted when I run my cursor over the “<footer class” – the smaller section – and “</article>” – which relates to the larger area?

    What code should I use and where should I place it that would remove this white space.

    The site I am working on is: https://www.nw3germantutor.co.uk.

Viewing 7 replies - 1 through 7 (of 7 total)
  • Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    It’ll either be margin or padding, doesn’t Firebug show you this already? It should show you the CSS not just the HTML.

    Thread Starter dionweston

    (@dionweston)

    I have yet to master Firebug properly but I have tried the following code placed in child style.css file with no effect.

    .site-content article {
        margin-bottom: none;
        padding-bottom: none;
    }
    Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    Maybe you’re looking at the wrong element. Can you illustrate the white space you want removed?

    Thread Starter dionweston

    (@dionweston)

    Its the white space immediately below the text line “N6 – Highgate” towards the bottom of the page and the feint double line, plus the white space below the double line and the single feint line that denotes the upper boundary of the footer.

    Thread Starter dionweston

    (@dionweston)

    In case I wasn’t clear enough, the site I am working on is: https://www.nw3germantutor.co.uk.

    The white spaces I’m referring to are at the bottom of the front page between the footer bar and the page text.

    Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    The margin and padding you added to the article was wrong.
    You cannot give them “none” values.

    Margin info: https://www.w3schools.com/css/css_margin.asp
    Padding info: https://www.w3schools.com/css/css_padding.asp

    So, instead of “none”, try giving them values of “0”.

    Thread Starter dionweston

    (@dionweston)

    Nailed it. Thx very much for your help Andrew. Really appreciate the links to ‘w3schools’.

Viewing 7 replies - 1 through 7 (of 7 total)
  • The topic ‘Removing white space from page bottom area of Twenty Twelve theme’ is closed to new replies.