Why is heading tag increasing cell height?

A

affiliateian

I am using a table with 2 rows and 1 column. The top row is the heading
for a short title (1 line of text) and the 2nd row is for paragraph
text. When I add any heading tags, <h1>, <h2> etc... to row 1, the cell
height of row 1 gets increased as if 1 or 2 <br> tags has been added.

Started to notice this after I began using CSS to help streamline my
website. My CSS settings for headings are simple like so:

font-family : Verdana, Arial, Helvetica, sans-serif;
font-size : 14pt;
color : black;

This happens with all different table types. Even tables which do not
have a CSS id. What can be causing this? Is it normal? Any ideas?
 
J

Jonathan N. Little

I am using a table with 2 rows and 1 column. The top row is the heading
for a short title (1 line of text) and the 2nd row is for paragraph
text. When I add any heading tags, <h1>, <h2> etc... to row 1, the cell
height of row 1 gets increased as if 1 or 2 <br> tags has been added.

Started to notice this after I began using CSS to help streamline my
website. My CSS settings for headings are simple like so:

font-family : Verdana, Arial, Helvetica, sans-serif;
font-size : 14pt;
color : black;

This happens with all different table types. Even tables which do not
have a CSS id. What can be causing this? Is it normal? Any ideas?

Margins on the headings.

TD H1, TD H2, TD H3 { margin: 0; }
 
N

Neredbojias

With neither quill nor qualm, (e-mail address removed) quothed:
I am using a table with 2 rows and 1 column. The top row is the heading
for a short title (1 line of text) and the 2nd row is for paragraph
text. When I add any heading tags, <h1>, <h2> etc... to row 1, the cell
height of row 1 gets increased as if 1 or 2 <br> tags has been added.

Started to notice this after I began using CSS to help streamline my
website. My CSS settings for headings are simple like so:

font-family : Verdana, Arial, Helvetica, sans-serif;
font-size : 14pt;
color : black;

This happens with all different table types. Even tables which do not
have a CSS id. What can be causing this?

The headings, of course. Headings have vertical whitespace. The can
usually be styled with the css "margin" and "padding" attributes.

eg:
 
B

Beauregard T. Shagnasty

I am using a table with 2 rows and 1 column. The top row is the
heading for a short title (1 line of text) and the 2nd row is for
paragraph text. When I add any heading tags, <h1>, <h2> etc... to row
1, the cell height of row 1 gets increased as if 1 or 2 <br> tags has
been added.

Please look into not using tables for layout.
Started to notice this after I began using CSS to help streamline my
website. My CSS settings for headings are simple like so:

font-family : Verdana, Arial, Helvetica, sans-serif;
http://xs4all.nl/~sbpoley/webmatters/verdana.html

font-size : 14pt;

That's smaller than my default size for content text. Consider setting
the body text to 100% (points are for print media), and setting the font
size for your headings at some percentage larger than 100.

body { font-size: 100%; }
h1 { font-size: 140%; }
h2 { font-size: 125%; }
..legalese { font-size: 85%; }
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Members online

Forum statistics

Threads
473,744
Messages
2,569,482
Members
44,901
Latest member
Noble71S45

Latest Threads

Top