#navbar {

margin: 0px;

margin-left: -20px;

margin-right: -50px;

padding: 0px;

text-align: center; /* Hvilken side du vil ha teksten på; left, right, center */

height: 1em; }

#navbar li {

list-style: none;

float: left; }

#navbar li a {

display: block;

width: 8.85em; /* Bredden på hver boks */

padding: 8px 14.167px; /* Den første bestemmer høyden på boksene */

background-color: #e40000; /* Fargen på boksene */

color: #fff; /* Farge på skriften i boksen */

text-decoration: none;

font-family: verdana; /* Skrifttype i boksen */

font-size: 10px; } /* Størrelsen på skriften i boksen */

#navbar li ul {

display: none;

text-align: center; /* Hvilken side du vil ha teksten i drop-down boksene; left, right, center */

width: 10.38em; /* Bredde på drop-down boksene */

background-color: #5a5a5a;} /* Farge på drop-down boksene */

#navbar li:hover ul, #navbar li.hover ul {

display: block;

position: absolute;

margin: 0px;

padding: 0;

z-index: 1; }

#navbar li:hover li, #navbar li.hover li {

float: none; }

#navbar li:hover li a, #navbar li.hover li a {

background-color: #5a5a5a; /* Farge på drop-down boksene */

border-bottom: 0px solid #fff;

color: #ffffff; } /* Farge på teksten i drop-down boksen mouseover */

#navbar li li a:hover {

background-color: #d3d3d3; } /* Farge på drop-down boksene mouseover */

margin-left: auto;

margin-right: auto;

} 

Det andre du må gjøre er å gå inn på malern. Der finner du "<div id="header">". Etter det skal navbar koden skrives inn.

Du begynner koden med "<ul id="navbar">" etterfulgt av en del mellomrom (<br><br>) ettersom hvor lavt/høyt du vil ha navbaren. Vil du ha den på toppen av headeren, har du ingen <br>, men vil du ha den under headeren må du bare prøve deg frem. Jeg måtte ha 23 <br>. Men dette er det lit vanskelig å gjøre noe med før du har fikset resten av koden. Så mellomrommene kan du la ligge til du er ferdig.

For å begynne på første boks limer du inn denne koden inn etter <dl id="navbar"> og de eventuelle <br>;

<li><a href="#">BOKS</a><ul>

DROP-DOWN BOKSER HER!

</ul></li>

Denne koden kopierer du utifra hvor mange bokser du vil ha. Du kan ha så mange du vil, men jeg annbefaler deg å holde deg på pluss/minus 5 bokser. Hvis du har ferre må du ha så lange bokser for å fylle plassen, mens har du flere må du ha dem korte. Der det står "BOKS" skriver du inn det du vil at det skal stå i boksen. Si for eksempel at denne skal være til kategoriene. Da skriver du "Kategorier" der det står "BOKS". 

Hvis du vil at selve boksen skal være en link, limer du inn ULR'n til siden du vil linke hvor det står "#". Du kan ha drop-down bokser selv om boksen også er en link. 

Så må du lime inn koden for drop-down bokser i boks koden over. Den plasserer du hvor det står "DROP-DOWN BOKSER HER". Du fyller inn URL'n du vil den skal linke til der det står "DINBLOGG" og hva du vil det skal stå der det står "TITTEL". Kopier koden utifra hvor mange drop-down bokser du vil ha i den boksen. Du kan ha så mange drop-down bokser i hver boks du bare vil. Eller du trenger ikke ha drop-down bokser i det hele tatt hvis du ikke vil det.

Koden er her;

<li><a href="DINBLOGG">TITTEL</a></li>

Da du er ferdig med den første boksen fortsetter du til du har fyllt inn alle boksene du vil ha. Etterpå må du og lime inn koden i de andre malerne. Husk også å legge inn mellomrommene så det passer hvis du valgte å utsette det.

Her er et eksempel på en ferdig kode:

<ul id="navbar"><br><br><br><br>

<li>

<a href="#">KATEGORIER</a>

<ul>

<li><a href="HTTP://DINBLOGG.BLOGG.NO/HVERDAG.HTML">HVERDAG</a></li>

<li><a href="HTTP://DINBLOGG.BLOGG.NO/SKOLE.HTML">SKOLE</a></li>

</ul>

</li>

<li>

<a href="#">ARKIV</a>

<ul>

<li><a href="HTTP://DINBLOGG.BLOGG.NO/M_052009.HTML">MAI</a></li>

<li><a href="HTTP://DINBLOGG.BLOGG.NO/M_062009.HTML">APRIL</a></li>

</ul></li>

Hvis du nå tar en titt på bloggen nå skal navbaren fungere, men bredden på boksene og fargene vil antgelig vis ikke stemme, og det vil ikke se så veldig bra ut enda. Har du seks bokser eller mer, vil antageligvis den ene være under de andre boksene. 

Og det er dette som er det kompliserte ved navbarene, men det er ikke så greit for meg å forklare det steg for sleg i og md at det er velgig individuelt for hver blogg. Men for å fikse på bredda og fargene må du endre litt på CSS koden du limte inn før. Hvis du går inn på CSS'n igjen kan du se at jeg har skrevet inn funksjonen til de delene du vil trenge å endre på. De andre kodene bør du ikke fikse så mye på hvis ikke du vet hva det gjør. Men du må egentlig bare prøve deg frem der og få det til å stemme til slutt.

Så jeg håper dere skjønnte mine klønete forklaringer og fikk det til uten noen problemer. Igjen, bare spør hvis det er noe du lurer på eller ikke skjønner.

Q: Fikk du det til?

Q: Var det forståelig?