• johnthomas19

    (@johnthomas19)


    My site johnthomasmusic.org use to have a header on each page that matched the tab. On some pages, I didn’t want the header to match the tab so I edited the style.css to get rid of it.

    But now I have a gap between the tab bar and where words first start on each page. My question is, how can I shrink (or get rid of) that gap?

    Any adivce?

    Thanks

Viewing 6 replies - 1 through 6 (of 6 total)
  • Thread Starter johnthomas19

    (@johnthomas19)

    Does anyone have any ideas?

    SimonJ

    (@simonj)

    Hum… What did you exactly edit in your style.css ?

    Your “content” and “post” div have both 10px of top padding… Wich will give you at least 20px of space before the title of the post…

    S.

    Thread Starter johnthomas19

    (@johnthomas19)

    I’m not 100% sure how I was able to get the header out. I either deleted that line in the php or changed a value to, ‘none.’ I’ve tried to go through and manipulate different paddings. I have no trouple moving the first words on each page down – I just can’t find a way to move them up.

    Any thoughts?

    Thread Starter johnthomas19

    (@johnthomas19)

    All I did to get rid of the page header was remove the line:
    <h2>” title=”<?php the_title(); ?>”><?php the_title(); ?></h2>

    Any idea on how I can get rid of the space there now?

    Thread Starter johnthomas19

    (@johnthomas19)

    Any ideas here wordpress wizards?

    It’s not a wordpress wizard question… 🙂

    It’s a CSS issue.

    Did you read my post above ?

    The content of your center column is in these three divs :

    <div id=”content”>
    <div class=”post”>
    <div class=”entry”>

    And your sentence : “Welcome to JohnThomasMusic.org” is embeded in a <p> tag…

    Then look in your style sheet… (style.css)

    content : padding: 10px;
    post : padding: 10px 0 10px 0;
    p : padding: 10px 0 0 0;

    The first div (content) put a 10 px padding… the second div (post) add another 10 px padding inside the first one. Finally, the <p> tag add another 10 px padding…

    So, starting from “content”, you end with a total of 30 px… About the space you have at the top I would guess… Your solution : adjust these value to get what you want.

    Two principle about padding and margin to get you started :

    1- when you have only one value, ie : padding: 10px : it means that the padding will be 10px on each side of the div (top, right, bottom, left)

    2- When you have four value, ie : padding: 10px 0 10px 0 : it means that you have a different value for each side, starting at the top in clockwise direction : top right bottom left.

    For instance, in your “post” div, you have : padding: 10px 0 10px 0;

    It means : 10px top, 0px right, 10px bottom, 0px left.

    Another example, your <p> tag :

    padding: 10px 0 0 0;

    It means 10px top, 0px right, 0px bottom, 0px left…

    Finally, a last example, in your “content” div :

    padding: 10px;

    It means 10px padding for each side…

    I suggest you to learn a little bit about CSS :
    http://www.w3schools.com/Css/

    S.

Viewing 6 replies - 1 through 6 (of 6 total)
  • The topic ‘Get rid of header area?’ is closed to new replies.