Retur til artiklen om CSS-formaterede menuer.
Navigationsbjælken tegnes ens i følgende browsere:
IE5, IE5.5, IE6, IE7, Mozilla 1.0, Opera 8, Firefox 1.0.4,
Firefox 1.5 og Netscape 7.
OBS!erver! at IE-specifikke formdeklarationer er indsat ved hjælp af Microsoft betingede kommentarer (grøn tekst). Flere af de såkaldte CSS-hacks, jeg hidtil har anvendt, invalideres af Internet Explorer version 7.
<style type="text/css" media="screen">
ul.navbar {
font-family:arial,sans-serif;
font-size:14px; /* em'er eller procenter er bedre, hvis
variabel højde kan tolereres */
line-height:100%;
height:22px; /* Summen af font-size, padding og border på a-markøren */
padding:0;
margin:0 0 0.5em 0;
list-style:none;
text-align:center;
border-left:1px solid black;}
ul.navbar li a {
/* width: 5em; Width *skal* med, når der floates - står der i reglerne */
/* Tegner dog ok i Mozilla, Firefox, Netscape 7, Opera, IE 6 og IE 5. Safari?*/
float:left;
margin:0;
padding:3px 5px;
border-width:1px 1px 1px 0;
border-style:solid;
border-color: #257;
color:#1a0080;
background:#fff;
text-decoration:none;
}
ul.navbar li a:visited { background-color:#eeeeee; }
ul.navbar li a:hover {color:#fff;background-color:#1a0080; }
.cl {clear:left;} /* Pga. float skal første element efter menuen clear'es */
</style>
<!--[if IE]>
<style type="text/css" media="screen">
ul.navbar li {display:inline;}
</style>
<![endif]-->
Denne artikel er senest opdateret 30. sep. 2006.