Problemer med kodingen html`en her

[srb]

Etter en avsporing i arbeidet og ferietilstander har jeg måtte bygge opp igjen sidene i en oppgave jeg arbeider med...
Disse sidene har jeg nå fått gjennetablert, MEN det henger et par løse tråder her, og jeg er veldig takknemmelig for noen hjelpende ideér her nå for å få laget denne oppgaven ferdig.
Det er 5 hovedsider, og det er en god del undersider.
Noen er ok her ved sjekk: http://validator.w3.org/ ... og noen ikke.
Her er adr: http://home.online.no/~pedebe/index.html
Der ser dere hvilke sider som ikke fungerer. Merk: alle linker virker:)
css her:

Kode: Merk alt

@charset "UTF-8";
/* CSS Document */

html{
   margin:0;
   padding:0;
   height:100%;
   margin-bottom:1px;
}

body{
   margin:0;
   padding:0;
   background-color:#FFFFFF;
}

a:link{
   text-decoration:none;
   color:#CCCCCC;
   font-family:Verdana, Arial, Helvetica, sans-serif;
   font-size:9px;
}
a:visited{
   text-decoration:none;
   color:#000000;
   font-family:Verdana, Arial, Helvetica, sans-serif;
   font-size:9px;
}
a:active{
   text-decoration:none;
   color:#333333;
   font-family:Verdana, Arial, Helvetica, sans-serif;
   font-size:9px;
}
a:hover{
   text-decoration:underline;
   color:#FFFFFF;
   font-family:Verdana, Arial, Helvetica, sans-serif;
   font-size:9px;
}

p{
font-family:Arial, Helvetica, sans-serif;
color:#FFFFFF;
font-size:small;
}

h3{
color:#CCCCCC;
font-family:Verdana, Arial, Helvetica, sans-serif;
}

#belte{
   position:relative;
   top:300px;
   background-color:#006699;
   height:50px;
   width:100%;
}

#hovedside{
   position:relative;
   top:0px;
   margin:0 auto;
   background-image:url(hjem.png);
   background-repeat:no-repeat;
   width:850px;
   height:650px;
}

   
#meny{
   position:absolute;
   left: 155px;
   list-style: none;
   top:160px;
   width: 63px;
   height: 421px;
}

#meny li, #meny li a{
   display:block;
   width: 65px;
   height: 60px;
   margin-top:20px;
}

#meny li a span{
  display:none;
}

#meny-hjem   { background:url(bildeknapp1.png) no-repeat;
}

#meny-studio { background:url(bildeknapp2.png) no-repeat;
}

#meny-utstyr { background:url(bildeknapp3.png) no-repeat;
}

#meny-erfaring { background:url(bildeknapp4.png) no-repeat;
}

#meny-kontakt { background:url(bildeknapp5.png) no-repeat;
}

#navcontainer{
   display:inline;
   position:absolute;
   width:370px;
   padding-left: 0;
   list-style: none;
   top:360px;
   left:370px;
   padding:0px;
   z-index:1;
}
 
#navlist li{
   display:inline;
   list-style-type:none;
   padding-right:20px;
   left:20px;
}

#textbox{
   overflow:auto;
   position:absolute;
   width:490px;
   height:200px;
   left:-130px;
   top:50px;
   padding:5px 5px 5px 5px;
   font-family:Verdana, Arial, Helvetica, sans-serif;
   font-size:12px;
   color:#CCCCCC;
   text-align:left;
   }


#bakScenen{
   position:relative;
   top:0px;
   margin:0 auto;
   background-image:url(hjembakscenen.png);
   background-repeat:no-repeat;
   width:850px;
   height:650px;
}

#nyheter{
   position:relative;
   top:0px;
   margin:0 auto;
   background-image:url(hjemnyheter.png);
   background-repeat:no-repeat;
   width:850px;
   height:650px;
}

#demo{
   position:relative;
   top:0px;
   margin:0 auto;
   background-image:url(hjemsenddemo.png);
   background-repeat:no-repeat;
   width:850px;
   height:650px;
}

#arrangement{
   position:relative;
   top:0px;
   margin:0 auto;
   background-image:url(hjemarrangement.png);
   background-repeat:no-repeat;
   width:850px;
   height:650px;
}

#studioogpris{
   position:relative;
   top:0px;
   margin:0 auto;
   background-image:url(studioogpris.png);
   background-repeat:no-repeat;
   width:850px;
   height:650px;
}

#studio{
   position:relative;
   top:0px;
   margin:0 auto;
   background-image:url(studio.png);
   background-repeat:no-repeat;
   width:850px;
   height:650px;
}

#utstyr{
   position:relative;
   top:0px;
   margin:0 auto;
   background-image:url(utstyr.png);
   background-repeat:no-repeat;
   width:850px;
   height:650px;
}

#erfaring{
   position:relative;
   top:0px;
   margin:0 auto;
   background-image:url(erfaring.png);
   background-repeat:no-repeat;
   width:850px;
   height:650px;
}

#kontakt{
   position:relative;
   top:0px;
   margin:0 auto;
   background-image:url(kontakt.png);
   background-repeat:no-repeat;
   width:850px;
   height:650px;
}

#studioFotostudioa{
   position:relative;
   top:0px;
   margin:0 auto;
   background-image:url(studiofotostudioa.png);
   background-repeat:no-repeat;
   width:850px;
   height:650px;
}

#studioFotostudiob{
   position:relative;
   top:0px;
   margin:0 auto;
   background-image:url(studiofotostudiob.png);
   background-repeat:no-repeat;
   width:850px;
   height:650px;
}

#studioFotostudioc{
   position:relative;
   top:0px;
   margin:0 auto;
   background-image:url(studiofotostudioc.png);
   background-repeat:no-repeat;
   width:850px;
   height:650px;
}

#pris{
   position:relative;
   top:0px;
   margin:0 auto;
   background-image:url(studiopriser.png);
   background-repeat:no-repeat;
   width:850px;
   height:650px;
}

#studioPriserprisa{
   position:relative;
   top:0px;
   margin:0 auto;
   background-image:url(studiopriserprisa.png);
   background-repeat:no-repeat;
   width:850px;
   height:650px;
}

#studioPriserprisb{
   position:relative;
   top:0px;
   margin:0 auto;
   background-image:url(studiopriserprisb.png);
   background-repeat:no-repeat;
   width:850px;
   height:650px;
}

#studioPriserprisc{
   position:relative;
   top:0px;
   margin:0 auto;
   background-image:url(studiopriserprisc.png);
   background-repeat:no-repeat;
   width:850px;
   height:650px;
}

#mixepultermicrofoneroglydrom{
   position:relative;
   top:0px;
   margin:0 auto;
   background-image:url(mixepultermicrofoglydrom.png);
   background-repeat:no-repeat;
   width:850px;
   height:650px;
}

#utstyrlydrom{
   position:relative;
   top:0px;
   margin:0 auto;
   background-image:url(utstyrlydrom.png);
   background-repeat:no-repeat;
   width:850px;
   height:650px;
}
   
#utstyrlydroma{
   position:relative;
   top:0px;
   margin:0 auto;
   background-image:url(utstyrlydroma.png);
   background-repeat:no-repeat;
   width:850px;
   height:650px;
}   
   
#utstyrlydromb{
   position:relative;
   top:0px;
   margin:0 auto;
   background-image:url(utstyrlydromb.png);
   background-repeat:no-repeat;
   width:850px;
   height:650px;
}
   
#utstyrlydromc{
   position:relative;
   top:0px;
   margin:0 auto;
   background-image:url(utstyrlydromc.png);
   background-repeat:no-repeat;
   width:850px;
   height:650px;
}

#utstyrmicrofoner{
   position:relative;
   top:0px;
   margin:0 auto;
   background-image:url(utstyrmicrofoner.png);
   background-repeat:no-repeat;
   width:850px;
   height:650px;
}


#utstyrmica{
   position:relative;
   top:0px;
   margin:0 auto;
   background-image:url(utstyrmicrofonera.png);
   background-repeat:no-repeat;
   width:850px;
   height:650px;
}   
   
#utstyrmicb{
   position:relative;
   top:0px;
   margin:0 auto;
   background-image:url(utstyrmicrofonerb.png);
   background-repeat:no-repeat;
   width:850px;
   height:650px;
}
   
#utstyrmicc{
   position:relative;
   top:0px;
   margin:0 auto;
   background-image:url(utstyrmicrofonerc.png);
   background-repeat:no-repeat;
   width:850px;
   height:650px;
}

#utstyrmixepulter{
   position:relative;
   top:0px;
   margin:0 auto;
   background-image:url(utstyrmixepulter.png);
   background-repeat:no-repeat;
   width:850px;
   height:650px;
}

#utstyrmixa{
   position:relative;
   top:0px;
   margin:0 auto;
   background-image:url(utstyrmixa.png);
   background-repeat:no-repeat;
   width:850px;
   height:650px;
}

#utstyrmixb{
   position:relative;
   top:0px;
   margin:0 auto;
   background-image:url(utstyrmixb.png);
   background-repeat:no-repeat;
   width:850px;
   height:650px;
}

#utstyrmixc{
   position:relative;
   top:0px;
   margin:0 auto;
   background-image:url(utstyrmixc.png);
   background-repeat:no-repeat;
   width:850px;
   height:650px;
}

#relasjoner{
   position:relative;
   top:0px;
   margin:0 auto;
   background-image:url(relasjoner.png);
   background-repeat:no-repeat;
   width:850px;
   height:650px;
}
   
#relasjonerartister{
   position:relative;
   top:0px;
   margin:0 auto;
   background-image:url(relasjonerartister.png);
   background-repeat:no-repeat;
   width:850px;
   height:650px;
}

#electronic{
   position:relative;
   top:0px;
   margin:0 auto;
   background-image:url(electronic.png);
   background-repeat:no-repeat;
   width:850px;
   height:650px;
}

#electronicart1{
   position:relative;
   top:0px;
   margin:0 auto;
   background-image:url(electronicart1.png);
   background-repeat:no-repeat;
   width:850px;
   height:650px;
}

#electronicart2{
   position:relative;
   top:0px;
   margin:0 auto;
   background-image:url(electronicart2.png);
   background-repeat:no-repeat;
   width:850px;
   height:650px;
}   


#electronicart3{
   position:relative;
   top:0px;
   margin:0 auto;
   background-image:url(electronicart3.png);
   background-repeat:no-repeat;
   width:850px;
   height:650px;
}

#electronicart4{
   position:relative;
   top:0px;
   margin:0 auto;
   background-image:url(electronicart4.png);
   background-repeat:no-repeat;
   width:850px;
   height:650px;
}

#gospel{
   position:relative;
   top:0px;
   margin:0 auto;
   background-image:url(gospel.png);
   background-repeat:no-repeat;
   width:850px;
   height:650px;
}

#gospelart1{
   position:relative;
   top:0px;
   margin:0 auto;
   background-image:url(gospelart1.png);
   background-repeat:no-repeat;
   width:850px;
   height:650px;
}

#gospelart2{
   position:relative;
   top:0px;
   margin:0 auto;
   background-image:url(gospelart2.png);
   background-repeat:no-repeat;
   width:850px;
   height:650px;
}

#gospelart3{
   position:relative;
   top:0px;
   margin:0 auto;
   background-image:url(gospelart3.png);
   background-repeat:no-repeat;
   width:850px;
   height:650px;
}

#gospelart4{
   position:relative;
   top:0px;
   margin:0 auto;
   background-image:url(gospelart4.png);
   background-repeat:no-repeat;
   width:850px;
   height:650px;
}

#jazz{
   position:relative;
   top:0px;
   margin:0 auto;
   background-image:url(jazz.png);
   background-repeat:no-repeat;
   width:850px;
   height:650px;
}

#jazzart1{
   position:relative;
   top:0px;
   margin:0 auto;
   background-image:url(jazzart1.png);
   background-repeat:no-repeat;
   width:850px;
   height:650px;
}

#jazzart2{
   position:relative;
   top:0px;
   margin:0 auto;
   background-image:url(jazzart2.png);
   background-repeat:no-repeat;
   width:850px;
   height:650px;
}

#jazzart3{
   position:relative;
   top:0px;
   margin:0 auto;
   background-image:url(jazzart3.png);
   background-repeat:no-repeat;
   width:850px;
   height:650px;
}

#jazzart4{
   position:relative;
   top:0px;
   margin:0 auto;
   background-image:url(jazzart4.png);
   background-repeat:no-repeat;
   width:850px;
   height:650px;
}

#norsk{
   position:relative;
   top:0px;
   margin:0 auto;
   background-image:url(norsk.png);
   background-repeat:no-repeat;
   width:850px;
   height:650px;
}

#norskart1{
   position:relative;
   top:0px;
   margin:0 auto;
   background-image:url(norskart1.png);
   background-repeat:no-repeat;
   width:850px;
   height:650px;
}

#norskart2{
   position:relative;
   top:0px;
   margin:0 auto;
   background-image:url(norskart2.png);
   background-repeat:no-repeat;
   width:850px;
   height:650px;
}

#norskart3{
   position:relative;
   top:0px;
   margin:0 auto;
   background-image:url(norskart3.png);
   background-repeat:no-repeat;
   width:850px;
   height:650px;
}

#norskart4{
   position:relative;
   top:0px;
   margin:0 auto;
   background-image:url(norskart4.png);
   background-repeat:no-repeat;
   width:850px;
   height:650px;
}

#tv{
   position:relative;
   top:0px;
   margin:0 auto;
   background-image:url(tv.png);
   background-repeat:no-repeat;
   width:850px;
   height:650px;
}
   
#tv1{
   position:relative;
   top:0px;
   margin:0 auto;
   background-image:url(tv1.png);
   background-repeat:no-repeat;
   width:850px;
   height:650px;
}

#tv2{
   position:relative;
   top:0px;
   margin:0 auto;
   background-image:url(tv2.png);
   background-repeat:no-repeat;
   width:850px;
   height:650px;
}

#film{
   position:relative;
   top:0px;
   margin:0 auto;
   background-image:url(film.png);
   background-repeat:no-repeat;
   width:850px;
   height:650px;
}


#film1{
   position:relative;
   top:0px;
   margin:0 auto;
   background-image:url(film1.png);
   background-repeat:no-repeat;
   width:850px;
   height:650px;
}

#film2{
   position:relative;
   top:0px;
   margin:0 auto;
   background-image:url(film2.png);
   background-repeat:no-repeat;
   width:850px;
   height:650px;
}            


   


Denne siden er korrekt:

Kode: Merk alt

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>hovedside</title>
 <link type="text/css" rel="stylesheet" href="presis.css" />
</head>
<body>
<div id="belte"></div>
 <div id="hovedside">
  <ul id="meny">
     <li id="meny-hjem"><a href="index.html"><span>Hjem</span></a></li>
     <li id="meny-studio"><a href="studioogpris.html"><span>Studio</span></a></li>
     <li id="meny-utstyr"><a href="mixepultermicrofoneroglydrom.html"><span>Utstyr</span></a></li>
     <li id="meny-erfaring"><a href="mixepultermicrofoneroglydrom.html"><span>Erfaring</span></a></li>
  <li id="meny-kontakt"><a href="kontakt.html"><span>Kontakt</span></a></li></ul>
 <div id="navcontainer">
  <ul id="navlist">
     <li id="active"></li>
     <li><a href="bak_scenen.html">bak scenen</a></li>
     <li><a href="nyheter.html">nyheter</a></li>
     <li><a href="demo.html">send demo</a></li>
     <li><a href="arrangement.html">arrangement</a></li></ul>
     <div id="textbox"><h3>Om Aiki</h3>
   <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. <br />Aenean commodo ligula eget dolor. Aenean massa.<br />
Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculupxs mus. <br />Donec.
Donec vitae sapien ut libero venenatis faucibus.
Maecenas tempus,<br /> tellus eget condimentum rhoncus, sem quam semper libero, sit amet adipiscing sem neque sed ipsum.<br /> Nam quam nunc, blandit vel, luctus pulvinar, hendrerit id, lorem. Maecenas nec odio et ante tincidunt tempus.<br /> Donec
Donec vitae sapien ut libero venenatis faucibus. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. <br />Aenean commodo ligula eget dolor. Aenean massa.<br />
Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. <br />Donec.
Donec vitae sapien ut libero venenatis faucibus.  Maecenas tempus,<br /> tellus eget condimentum rhoncus, sem quam semper libero, sit amet adipiscing sem neque sed ipsum.<br /> Nam quam nunc, blandit vel, luctus        pulvinar, hendrerit id, lorem. Maecenas nec odio et ante tincidunt tempus.<br /> Donec
Donec vitae sapien ut libero venenatis faucibus</p>
     </div>
    </div>
   </div>
</body>
</html>


Denne siden er ikke bra:

Kode: Merk alt

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>studio og pris</title>
 <link type="text/css" rel="stylesheet" href="presis.css" />
</head>
<body>
<div id="belte"></div>
  <div id="pris">
     <ul id="meny">
       <div id="textbox"><p><h3>Aiki tilbyr differensierte priser</h3>Prisene er inndelt etter de retningslinjer den Nordiske musikkproduksjonsorganisasjonen har definert, og sikrer korrekt pris for den enkelte musiker.</p>                 </div>
  <li id="meny-hjem"><a href="index.html"><span>Hjem</span></a></li>
  <li id="meny-studio"><a href="studioogpris.html"><span>Studio</span></a></li>
  <li id="meny-utstyr"><a href="mixepultermicrofoneroglydrom.html"><span>Utstyr</span></a></li>
  <li id="meny-erfaring"><a href="erfaring.html"><span>Erfaring</span></a></li>
  <li id="meny-kontakt"><a href="kontakt.html"><span>Kontakt</span></a></li></ul>
     <div id="navcontainer">
     <ul id="navlist">
     <li id="active">
     <li><a href="studioPriserprisa.html">pris A</a></li>
     <li><a href="studioPriserprisb.html">pris B</a></li>
     <li><a href="studioPriserprisc.html">pris C</a></li>
   </ul></div>
  </div>
</div>
</body>
</html>


Noen har sagt at jeg burde endret denne versjonen av html doc ... kan det utgjøre slike feil??

[eelay]

Jeg ser ingen grunn til å forandre dokumenttypen egentlig. å kode i xhtml 1.0 transitional burde være et minimum mener jeg.

Men htmlkoden er jo et sant kaos.. Er dette håndkodet eller har du brukt en wysiwyg-editor?

Ser på siden din at det er bare hovedsiden som validerer, mens resten ikke gjør det. Det er jo litt rart da det bare er teksten som er forandret. Så fiksen der er jo ganske enkel; kopier htmlkoden fra hovedsiden til de andre sidene og forandre tekten.
Bør også nevnes at du har tatt litt av med id bruken.. å definere vært eneste element med en id er en tanke overdrevet.

men over til koden du har postet her.

1. du har ikke åpnet den første listen din med </ul>

Kode: Merk alt

 <li id="meny-hjem"><a href="index.html"><span>Hjem</span></a></li>
  <li id="meny-studio"><a href="studioogpris.html"><span>Studio</span></a></li>
  <li id="meny-utstyr"><a href="mixepultermicrofoneroglydrom.html"><span>Utstyr</span></a></li>
  <li id="meny-erfaring"><a href="erfaring.html"><span>Erfaring</span></a></li>
  <li id="meny-kontakt"><a href="kontakt.html"><span>Kontakt</span></a></li>
</ul>


skal være :

Kode: Merk alt

<ul>
 <li id="meny-hjem"><a href="index.html"><span>Hjem</span></a></li>
  <li id="meny-studio"><a href="studioogpris.html"><span>Studio</span></a></li>
  <li id="meny-utstyr"><a href="mixepultermicrofoneroglydrom.html"><span>Utstyr</span></a></li>
  <li id="meny-erfaring"><a href="erfaring.html"><span>Erfaring</span></a></li>
  <li id="meny-kontakt"><a href="kontakt.html"><span>Kontakt</span></a></li>
</ul>


2. Du har ikke avsluttet en <li> tagg i nav-listen.

Kode: Merk alt

<ul id="navlist">
     <li id="active">
     <li><a href="studioPriserprisa.html">pris A</a></li>
     <li><a href="studioPriserprisb.html">pris B</a></li>
     <li><a href="studioPriserprisc.html">pris C</a></li>
</ul>


skal være:

Kode: Merk alt

<ul id="navlist">
     <li id="active">ett eller annet</li>
     <li><a href="studioPriserprisa.html">pris A</a></li>
     <li><a href="studioPriserprisb.html">pris B</a></li>
     <li><a href="studioPriserprisc.html">pris C</a></li>
</ul>


Så har du en </div> for mye på slutten.

håper det var litt til hjelp iallefall

[srb]

Takk for hjelpen unge mann!
Det ser ut til å være en snodig ting likevel... du sier jeg er vel "rundhpndet" med kodingen min. Den har jeg "fått", så det er i tilfellet noen andre da som strør om seg med slike:)
Vel, lærte noe der likevel. Takk.
Jeg har kodet den i Dw, siden du spurte. Setter inn noe av koden, så kan man la maskinen kode resten.

[eelay]

Bare hyggeli det.

Skulle det dukke opp nye problemer så er det bare å hyle ut vet du

[srb]

hahah takk du, ser ikke bort fra at ett eller annet kan krølle seg litt i fortsetningen nei.

kan egentlig slenge ut dette eksemplaret av en vanskelig sak.

Kode: Merk alt

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>studio og pris</title>
 <link type="text/css" rel="stylesheet" href="presis.css" />
</head>
<body>
<div id="belte"></div>
  <div id="studioogpris">
  <ul id="meny">
  <li id="meny-hjem"><a href="index.html"><span>Hjem</span></a></li>
  <li id="meny-studio"><a href="studioogpris.html"><span>Studio</span></a></li>
  <li id="meny-utstyr"><a href="mixepultermicrofoneroglydrom.html"><span>Utstyr</span></a></li>
  <li id="meny-erfaring"><a href="relasjoner.html"><span>Erfaring</span></a></li>
  <li id="meny-kontakt"><a href="kontakt.html"><span>Kontakt</span></a></li></ul>    
  <div id="textbox"><h3>Studioene og prisgruppene</h3><p>Disse tre <a href="studioene.html">studioene</a> har hver sine spesielfunksjoner og de er innredet med det nyeste utstyret og tilfredstiller dermed de krav som musikere i dag stiller.</p><p>Det er tre <a href="pris.html">prisgrupper</a>. Her kan du se mer detaljer om hvert av studioene, samt se oversikt over de forskjellige prisgruppe.</p></div>
  <ul id="meny2">
  <li id="meny2-prisene"><a href="priser.html"><span>prisgrupper</span></a></li>
  <li id="meny2-studioene"><a href="studioene.html"><span>studioene</span></a></li></ul>
  </div>
</body>
</html>

Her skjønner du er det egentlig en utfordring i at det er en meny nr to... denne hadde jeg med i min første utgave, før jeg fikk ødelagt det for meg. Da virket alle sidene, med alle linker (stort sett). Kunne det være en mulighet å ha med meny to når den ikke er i css´en? Skjønner ikke dette for jeg hadde aldri en slik meny nr to i css´en da heller.