- This topic is empty.
Viewing 3 posts - 1 through 3 (of 3 total)
Viewing 3 posts - 1 through 3 (of 3 total)
- The forum ‘CSS’ is closed to new topics and replies.
The forums ran from 2008-2020 and are now closed and viewable here as an archive.
Right now there is a huge gap between my h1 and h2 text in the header of my page. I can’t figure how how to get them closer to one another.
CSS
[HTML]
#header { background:url(/assets/images/header.png) no-repeat; height: 174px; width: 650px; margin: 0 auto; margin-top: 0px; margin-bottom: 0px;
}
h1 {
font: Times New Roman, Times, serif, sans-serif, Arial;
font-size: 40px;
color:#CCCCCC;
text-transform:capitalize;
text-align:center;
padding-top: 50px;
}
h2 {
font: Times New Roman, Times, serif, sans-serif, Arial;
font-size:10px;
color:#CCCCCC;
text-align: center;
}
[/HTML]
HTML
[HTML]
<div id="header">
<h1>TEXT</h1>
<h2>Text Text Text Text</h2>
</div>
[/HTML]
Any idea how i can fix it?
Here is a link to my test page.
http://www.gamerunion.com/test.html
Fixed it on my own. by adding a class for line height.
h1.small {line-height: 20%}
h2.small {line-height: 10%}
<h1 class="small">Hello</h1>
<h2 class="small">Hello</h2>
Why not set the padding and margin on both headings to 0px (except for your top-padding), and set your line-height for both in px values?