Mysko CSS-fel

Efter ett serverbyte där min sida ligger har något enormt skumt inträffat. Före serverbytet var allt som vanligt, alla länkar hade rätt färg oavsett webbläsare. Nu, efter bytet ser allt normalt och fint ut i Firefox, även efter att man klickat sig runt en del. Men i IE (6) däremot verkar det som om den helt ignorerar färgen för a:visited och ersätter den med a:hover eller a:active (de senare två har samma färg så de går inte att skilja på). Vad i herrans namn kan ha hänt? Och vad gör jag åt det? :q

Bifogar skärmdump från menyn. Fel.JPG (Första bilden) visar det IE 6 visar, ffCorr.JPG (andra bilden) visar vad Firefox visar, vilket är så det borde se ut.

Så Terms of Use ska vara utanför boxen?

voigtann1 skrev:

Så Terms of Use ska vara utanför boxen?

Nej, egentligen inte. Men det är ett gammalt problem som inte har ett skvatt med nuvarande problem att göra. Boxens bredd har varit fel i Firefox hela tiden.

Problemet nu är att färgerna blir fel i IE. Menyns länkar borde vara blå, alla utom det submenyalternativ jag för närvarande pekar på, vilket är så det ser ut i Firefox.

Men i IE är huvudmenyn gul (active/hover färg) och i submenyn är alla länkar vars sidor jag besökt nyligen röda (active/hover färg). Istället för blå. Eftersom länkarna till de två sidor jag inte tittat på på ett tag är blå, så drar jag slutsatsen att a:link funkar men inte a:visited. (Vilken borde ha samma färg som a:link, eftersom det är en meny. Och, ja, det ser ut så i min CSS, vilket borde framgå av att det ju funkar i Firefox! )

Kan inte hjälpa dig utan att se sidan eller koden...

Sidan är rent allmänt inte särskilt vacker, men, men... här är den.

Du har:

a:visited.menu

Testa:

a.menu:visited

Tyvärr ingen skillnad alls. Båda läsarna ser ut som i bifogade filer. :(

Men du har fortfarande dessa:

a:link.head {     /*link - länk som ännu inte har besökts*/
  color: #FFCC00;
}

a:visited.head {  /*visited - länk som har besökts*/
  color: #FFCC00;  /*Annars ljust grå (silver) eller ngt... grön?*/
}

a:hover.head {    /*hover - mouseover*/
  color: #3366CC;
}

a:active.head {   /*active - vid klick*/
  color: #FFCC00;
}

Den klassen används ingenstans mig veterligen, men även den är ändrad nu och resultatet är detsamma... :( Ingen förändring.

Efter en hektisk julmånad har jag nu äntligen hunnit ta tag i detta problem igen. Trial and error visar att problemet beror på att a.visited får samma behandling som a.hover! x( Längre än så har jag inte lyckats deschiffrera problemet.

Jag har plockat bort all gammal kod numera oanvänd kod. Ingen skillnad!
Bytt namn på filen (och alla inkluderingar). Ingen skillnad!

För ögonblicket har jag temporärt "löst" problemet så att menyns klasser är samma för visited och hover, vilket gör att den icke använda menyn ser OK ut, men i gengäld kan man ju inte se var musen är... (eftersom hover har samma färg som link (och visited)). SUCK!

Men... problemet (visited får färg av hover) uppstår ju bara i IE... och då börjar jag undra... Varför påverkas IE överhuvudtaget av mina CSS förändringar? :q Jag har ju en JS-funktion för att få IE att visa det jag vill? Ligger felet i den, månne?

sfHover = function() {
        var sfEls = document.getElementById("nav").getElementsByTagName("LI");
        for (var i=0; i<sfEls.length; i++) {
                sfEls[i].onmouseover=function() {
                        this.className+=" sfhover";
                }
                sfEls[i].onmouseout=function() {
                        this.className=this.className.replace(new RegExp(" sfhover\\b"), "");
                }
        }
}
if (window.attachEvent) window.attachEvent("onload", sfHover);

Jag skulle verkligen uppskatta hjälp för jag har ingen aning om hur jag ska gå vidare med felsöket...??? :q

Nuvarande CSS (link-delen):

a:link {     /*link - länk som ännu inte har besökts*/
  color: #3366CC;
}

a:visited {  /*visited - länk som har besökts*/
  color: #FF4141;  /*Annars ljust grå (silver) eller ngt... grön?*/
}

a:hover {    /*hover - mouseover*/
  color: #FFCC00;
}

a:active {   /*active - vid klick*/
  color: #FFCC00;
}

/* Måste definiera alla varianter för menu, inte bara den som skiljer sig åt. */
a.menu:link {     /*#3366CC;link - länk som ännu inte har besökts*/
  color: #3366CC;
}

/*Visited körs över av hover....???*/
a.menu:visited {  /*visited - länk som har besökts*/
  color: #00AA00;  /*#3366CC Annars ljust grå (silver) eller ngt... grön?*/
}

a.menu:hover {    /*#FFCC00;hover - mouseover*/
  color: #3366CC;
}

a.menu:active {   /*#FFCC00;active - vid klick*/
  color: #FFCC00;
}

/* Fish-submenu */
/* Måste definiera alla varianter för menu, inte bara den som skiljer sig åt. */
a.submenu:link {     /*link - länk som ännu inte har besökts*/
  color: #3366CC;
  text-decoration:none;
}

a.submenu:visited {  /*visited - länk som har besökts*/
  color: #3366CC;  /*Annars ljust grå (silver) eller ngt... grön?*/
  text-decoration:none;
}

a.submenu:hover {    /*#DC143C;hover - mouseover*/
  color: #3366CC;
  text-decoration:none;
}

a.submenu:active {   /*active - vid klick*/
  color: #DC143C;
  text-decoration:none;
}

/*slut fish submeny*/

Jag tycker inte det ser ut att vara fel någonstans i css.
Men när det gäller vald länk "visited" ska man på något sätt få webläsaren att förstå när länken är vald. Visited historiskt brukar det inte finnas några svårigheter med...
Men det som skrivs ut ska se ut som något liknande för en länk på sidan man finns på.
<a class="vald" href="#">Länk</a>
Något man får skriva på varje sida man är på eller få php att göra.
Blev det luddigt?

Nu när jag läser det jag skrev så är det mer än luddigt :)
Eftersom du hade ändrat hover till samma färg som visited så kopierade jag menyn och testade den med svart som hoverfärg och det fungerade som det skulle i IE.
Så för mig fungerar både javascriptet och hover.
Däremot fungerade inte det som visar vart man är och därför skrev jag som jag gjorde.