12 svar · 559 visningar · startad av Jesper T
Jag får fel färgbeteckning på w3c css-validator.
Går det inte att validera rätt med "scrollbar"?
w3c skrev:
Context : body
Property scrollbar-face-color doesn't exist : #666666
osv...
Med:
body
{
scrollbar-face-color: #666666;
scrollbar-shadow-color: #666666;
scrollbar-highlight-color: #666666;
scrollbar-3dlight-color: #666666;
scrollbar-darkshadow-color: #666666;
scrollbar-track-color: #666666;
scrollbar-arrow-color: #FFFFFF;
}
Scrollbar är väl ett påhitt från Microsoft.
Ja, det är väl det. Damit.
En fuling:
Du kan ju alltid peta in just de stilarna med ett Javascript som dras igång av <body onload> om du råkar köra MSIE...
CSS-Validatorn kollar ju inte Javascriptkoden och resultatet blir ett validerat dokument som trots det godkända valideringsresultatet innehåller programmässigt inlagda MS-Specifika stilregler ;)
Smart!
...men det är egentligen inte korrekt. :(
Det är sant. Det är inte korrekt enligt standard. Men ibland får man vara lite praktisk - och jag anser att det är bättre att köra så långt det går med validerad kod och sedan "tweaka på" med några "fulingar" som inte påverkar hur sidan visas i webbläsare som stödjer standard än att totalt strunta i validering ;)
Fast det är klart - när jag tänker efter så är mitt tips ovan kanske lite väl grovhugget... och jag kom just på att det faktiskt finns ett sätt tilll....
Så...
Här är ett enklare sätt
Om man inte kan eller vill snärja in sig i Javascriptberoende, så har ju MS också så finurligt försett oss med MSExplorer-specifika "villkorliga kommentarer" (conditional comments)...
http://msdn.microsoft.com/workshop/author/dhtml/overview/ccomment_ovw.asp
Såhär skulle du lösa ditt valideringsproblem med dessa och ändå få till det utseende du vill på dina rullningslister:
[b]<!--[if gte IE 6]>[/b]
<style type="text/css">
body
{
scrollbar-face-color: #666666;
scrollbar-shadow-color: #666666;
scrollbar-highlight-color: #666666;
scrollbar-3dlight-color: #666666;
scrollbar-darkshadow-color: #666666;
scrollbar-track-color: #666666;
scrollbar-arrow-color: #FFFFFF;
}
</style>
[b]<![endif]-->[/b]
Detta exempel lägger du i <head> på alla dina sidor.
För alla webbläsare och validatorer som följer standard, blir detta en bortkommenterad <style>-tagg eftersom allt mellan <!-- och --> är en kommentar enligt standard...
För MSIE >= 6.0 blir det en <style>-tagg som skall tolkas som vanligt eftersom den tolkar <!--[ som en villkorlig kommentar och "kör vidare" om villkoret är uppfyllt ;)
Jag tycker att det är en lysande kompromiss av Microsoft att man med detta kan kommentera bort MSIE-specifik kod för övriga webbläsare automagiskt (funkar dessutom i MSIE5+ - så det har funnits med ett tag) !
Du kan ju lägga kommentarer runt <link rel="stylesheet"> eller <style ...>@import...</style> också om du vill ha din rullningslist-CSS i en extern fil förresten ;)
det enda du får se upp med är att du inte kan ha detta inuti en <style>-tagg eftersom kommentarer i CSS skrivs med /* och */ och att du alltså på så sätt sabbar din CSS-kod för samtliga webbläsare om du försöker. Men man får ju å andra sidan ha hur många <style> som helst i <head>... Så det är nog egentligen bara en fråga om att inte skjuta sig i foten bara för att man inte tänkte på det ;)
Fortfarande är denna lösning inte "korrekt" om man bara ser till W3C-standard - men den är f-n så praktiskt om man "bara vill lägga till litegrann" MSIE-specifikt... som t.ex. rullningslistutseende och ändå få sin kod genom validatorn :e
Red: Felaktig kod rättad ovan - se nedan ;)
Kan meddela att det gjorde skillnad på w3c...
Men även fast jag satt den IE-specifika koden i head efter konstens alla regler så skrev webläsaren(I.E 6.0) ut kommentarerna överst på skärmen...öhhh <!--[if IE osv...
Hmm...
Så kan det gå när man inte testar precis allt som har med MSIE att göra utan läser manualen istället - och dessutom tydligen missuppfattar den :r
Jag körde visst med
<!--[if IE 6]>
såg jag när jag grävde fram den gamla sidan som jag använde detta på en gång i tiden...
Och provar jag med den koden så verkar det funka som det skall i MSIE 6 hos mig iallafall...
Sorry 'bout the confusion :r
Red:
grmblll !!!!! x( x( x(
Det skulle visst ha stått
<!--[if gte IE 6]>
från början och inte det jag ursprungligen skrev!!!
Och skriver man så - så verkar det också funka...
hrrrmmpf.
Ändrar ursprungsmeddelandet också för säkerhets skull...
Ursäkta en gammal tok än en gång för förvirringen! x(
Tack. Jag hade ju kunnat läsa innantill jag också... :r
en liten intressant notis om just att ändra scrollbaren så är detta faktiskt borttaget ifrån ie6. såvida man inte sätter den i quirks mode då den simulerar ie5.
I Jespers exempel fungerar det alldeles utmärkt. Jag antar att du menar att det ej fungerar för själva dokumentets "scrollbar" när dokumentet är i "standards mode", d.v.s.
body{
scrollbar-face-color: #FFFFFF;
/* o.s.v. */
}
Detta löser man med att ge "scrollbar"-egenskaperna till såväl "body"-elementet som "html"-elementet ( eller endast "html"-elementet ):
[b]html[/b],body{
scrollbar-face-color: #FFFFFF;
/* o.s.v. */
}
Att möjligheten att ändra utseendet på "scrollbaren" i IE6 skulle vara borttaget stämmer alltså inte.
:)
där ser man. alltid lär man sig något nytt :)