Adjusting font of H1

Chris McGarry

Hello,

I am trying to use a heading tag in my pages but want to control the
look via a style sheet. I am new at CSS but here's what I have so far:

<HTML><HEAD>
<STYLE TYPE="text/css">
H1 {font-family: Arial; font-size: 12pt; color: white; text-align:
center}
</STYLE>
</HEAD>
<BODY>
<TABLE borderColor=black cellSpacing=0 cellPadding=1 width="95%"
align=center border=2>
<TR><TD bgColor=#000f99><H1>Topic Title</H1></TD></TR>
<TR><TD>Content goes here...</TD></TR>
</TABLE>
</BODY>
</HTML>

Now my problem is the height of the first row in the table... See what
happens... the cell looks like it takes the height of a standard h1
tag. Any way that anyone sees to shrink the height of the first row to
the font specified in the CSS?

I feel like I'm missing something easy here...
Thanks,
Chris

Neal

On 17 May 2004 23:14:34 -0700, Chris McGarry <mc*****@paccorp.com> wrote:

Hello,

I am trying to use a heading tag in my pages but want to control the
look via a style sheet. I am new at CSS but here's what I have so far: .... Now my problem is the height of the first row in the table... See what
happens... the cell looks like it takes the height of a standard h1
tag. Any way that anyone sees to shrink the height of the first row to
the font specified in the CSS?

I feel like I'm missing something easy here...

Only happens in IE. Add this to h1 style:

margin-bottom: 0;

Arne

Neal wrote:

On 17 May 2004 23:14:34 -0700, Chris McGarry <mc*****@paccorp.com> wrote:

Hello,

I am trying to use a heading tag in my pages but want to control the
look via a style sheet. I am new at CSS but here's what I have so far:

....
Now my problem is the height of the first row in the table... See what
happens... the cell looks like it takes the height of a standard h1
tag. Any way that anyone sees to shrink the height of the first row to
the font specified in the CSS?

I feel like I'm missing something easy here...

Only happens in IE. Add this to h1 style:

margin-bottom: 0;

And use em or percent for the font-size, for readability. Some IE
users may think the 12pt is to small and pt is for print.

--
/Arne

Chris McGarry

Arne <ar********@telia.com> wrote in message news:<Fk********************@newsc.telia.net>...

Neal wrote:
On 17 May 2004 23:14:34 -0700, Chris McGarry <mc*****@paccorp.com> wrote:

Hello,

I am trying to use a heading tag in my pages but want to control the
look via a style sheet. I am new at CSS but here's what I have so far:

....
Now my problem is the height of the first row in the table... See what
happens... the cell looks like it takes the height of a standard h1
tag. Any way that anyone sees to shrink the height of the first row to
the font specified in the CSS?

I feel like I'm missing something easy here...

Only happens in IE. Add this to h1 style:

margin-bottom: 0;

And use em or percent for the font-size, for readability. Some IE
users may think the 12pt is to small and pt is for print.

Nice! Thanks Neal and Arne that did the trick. One additional
question: Netscape 4 still behaves that way. I'm assuming
margin-bottom is not compatible with NS4. Is that the case? This is
not a deal killer because I think NS4 is dying but it would be nice to
have it look uniform.

Thanks,
Chris

Darin McGrew

Chris McGarry <mc*****@paccorp.com> wrote:

Nice! Thanks Neal and Arne that did the trick. One additional
question: Netscape 4 still behaves that way. I'm assuming
margin-bottom is not compatible with NS4. Is that the case?

When it first came out, NN 4's CSS support wasn't too bad. It was certainly
a huge improvement over MSIE 3's CSS support. But that was 7 years ago.

Just hide all your CSS from NN 4, and let it view your site as a
CSS-unaware browser would. See
http://w3development.de/css/hide_css_from_browsers/
--
Darin McGrew, mc****@stanfordalumni.org, http://www.rahul.net/mcgrew/
Web Design Group, da***@htmlhelp.com, http://www.HTMLHelp.com/

"Men build too many walls and not enough bridges." - Sir Isaac Newton

Chris McGarry

Darin McGrew <mc****@stanfordalumni.org> wrote in message news:<c8**********@blue.rahul.net>...

Chris McGarry <mc*****@paccorp.com> wrote:
Nice! Thanks Neal and Arne that did the trick. One additional
question: Netscape 4 still behaves that way. I'm assuming
margin-bottom is not compatible with NS4. Is that the case?

When it first came out, NN 4's CSS support wasn't too bad. It was certainly
a huge improvement over MSIE 3's CSS support. But that was 7 years ago.

Just hide all your CSS from NN 4, and let it view your site as a
CSS-unaware browser would. See
http://w3development.de/css/hide_css_from_browsers/

Hi Darin,

Yeah I probably will just hide it like you say. Good idea and thanks!

Chris

Lesley

mc*****@paccorp.com (Chris McGarry) wrote in message news:<b2**************************@posting.google. com>...

Hello,

I am trying to use a heading tag in my pages but want to control the
look via a style sheet. I am new at CSS but here's what I have so far:

<HTML><HEAD>
<STYLE TYPE="text/css">
H1 {font-family: Arial; font-size: 12pt; color: white; text-align:
center}
</STYLE>
</HEAD>
<BODY>
<TABLE borderColor=black cellSpacing=0 cellPadding=1 width="95%"
align=center border=2>
<TR><TD bgColor=#000f99><H1>Topic Title</H1></TD></TR>
<TR><TD>Content goes here...</TD></TR>
</TABLE>
</BODY>
</HTML>

Now my problem is the height of the first row in the table... See what
happens... the cell looks like it takes the height of a standard h1
tag. Any way that anyone sees to shrink the height of the first row to
the font specified in the CSS?

Not knocking on anything anyone else has said *and* somewhat off topic
but have you considered using the <th> tag for table headers?

:)

Lesley

Adjusting font of H1

This discussion thread is closed

Similar topics