Posted 3 years ago #
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
Posted 3 years ago #
Does anyone have any ideas?
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.
Posted 3 years ago #
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?
Posted 3 years ago #
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?
Posted 3 years ago #
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.
This topic has been closed to new replies.
