Navigationsbjælkens position

Navigationsbjælken på denne side er den samme som i eksempel 10, men her er html-koden til menuen indsat i bunden af kildekoden:

<div id="menu">
<ul class="navbar">
<li><a id="link1" href="/">Forsiden</a></li>
<li><a href="/gen/">Generelt</a></li>
<li><a href="/design/">Design</a></li>
<li><a href="/css/">CSS </a></li>
<li><a href="/javascript/">JavaScript</a></li>
<li><a href="/navigation/">Navigation</a></li>
<li><a href="/dhtml/">DHTML</a></li>
</ul>
</div>

Grunden til det er, at jeg gerne vil have at søgerobotter, talende browsere og andre tekstanalyseværktøjer “ser” artiklens overskrift og tekst før menuen.

Det får større betydning, des mere omfangsrig menuen er.

Sagen klares ved at indkapsle menuen i en div og positionere denne absolut:

#menu {position:absolute; left:0; top:110px; }

Det springende punkt her er værdien for top. Den har jeg regnet mig frem til på følgende måde:
Banner margin-top: 1em = 16 pixel
Banner height: 60 pixel
Banner padding-top og padding-bottom: 32 pixel
Banner border-top og border-bottom: 2 pixel
– i alt 110 pixel.

Webdesign - illustreret håndbog
Webdesign med XHTML

– 2 gode bøger om webdesign
Køb dem hos forlaget Globe A/S