Fontstørrelse driller

em er en relativ enhed, der tager udgangspunkt i den skriftstørrelse, der ellers ville have ramt elementet (det betyder faktisk m-højde, som tager udgangspunkt i den størrelse et m har i bredden, hvoraf det jo også fremgår, at der skal være en font-størrelse i forvejen !-)

-- så enten du eller browseren har sat en skriftstørrelse et sted, som påvirker dine h2-tags forskelligt fra de elementer, du sætter din tekst i !o]

Men plejer man ikke at sige, at det bedste er at bruge em og ikke px fordi brugeren så har mulighed for fx at øge fontstørrelsen?

Og definitionen af <H2> står lige umiddelbart efter <H1>, som ikke giver problemer....

Ja, men hvilke elementer skal de forholde sig til, der hvor de bruges i dokumentet ?-)

-- og det er helt korrekt, at der af fleksibilitetsårsager bør bruges relative størrelser der, hvor det kan lade sig gøre, men der er jo også en anden familie af relative: de gammelkendte font-størrelser fra 1 til 7, som i css hedder: xx-, x-, small, medium, large, x- og xx-large !-)

Hvad mener du med "hvilke elementer skal de forholde sig til, der hvor de bruges i dokumentet ?"

Jeg starter mit stylesheet således:

body {
margin:0px;
padding:0;
background-color: #D66AAA;
height:100%;
background-image: url(bag-cykel-2.gif);
color: #E8EAA6;
font-size: 0.7em;
font-family: Verdana, Arial, Helvetica, Sans-Serif;
font-style: normal; 
}

F.eks.

<table style="font-size:xx-small;">
  <tr>
    <td>
      <h2>Et &lt;h2&gt;-tag i en tabel</h2></td>
  </tr>
</table>
<h2>Et &lt;h2&gt;-tag udenfor tabellen</h2>

-- i mit grund-dokument er font-size sat til small, og så har jeg til dette sat den til 1em på h2-tags !-)

Uhada, bruger du tables!

Jeg forstår ikke helt. Jeg troede, at det var tilstrækkeligt at angive "grund" størrelsen eet sted - sådan jeg har gjort ovenfor i body

Det er da logisk nok at h2 skal sættes til 1em for at være samme størrelse som Brødteksten. Det er jo som sagt en relativ enhed.
Hvis nu du vil have den dobbelt så stor som brødteksten sættes den til 2em.

- det er jo det der er det smarte :)

Se her http://www.thenoodleincident.com/tutorials/typography/
Han starter med at sætte teksten til 76% og så resten i em.
Du kan så sætte den ned hvis du vil have den mindre. Men hans argument er at det giver samme størrelse i forskellige browsere.

-- hrm, tabellen var bare for at vise et eksempel, men ellers er der da intet i vejen med den slags !-)

-- og du kan jo bare erstatte den med f.eks. en span eller div:

<style type="text/css">
html,body{height:100%;margin:0px;border:0px;padding:0px;font-family:tahoma,verdana,arial,sans-serif;font-size:small;}
h2{font-size:1em;}
</style>

<div style="font-size:xx-small;">
  <h2>Et &lt;h2&gt;-tag i en div</h2></td>
</div>
<h2>Et &lt;h2&gt;-tag udenfor diven</h2>