View Full Version : Firefox läser inte CSS filen?
Hej,
Jag har under de senaste dagarna stött på problemet att Firefox inte läser en CSS fil. IE7 klarar det alldeles utmärkt och jag förstår inte vas som är fel.
Jag bifogar min CSS fil och HEAD:n i HTML filen:
HTML fil:
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<link rel="stylesheet" type="text/css" href="style.css" />
<title>Test - Startsida</title>
</head>
CSS fil:
body {
background-image: url(images/layout/clouds.png);
background-attachment:fixed;
}
.style1 {
font-size: 10px;
font-family: Verdana, Arial, Helvetica, sans-serif;
color: #000000;
}
.style2 {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;
color: #000000;
font-weight: bold;
padding-left: 5px;
}
.style3 {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;
color: #FFFFFF;
font-weight: bold;
padding-left: 17px;
}
.style4 {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;
color: #FFFFFF;
font-weight: bold;
padding-left: 5px;
}
.copy {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;
color: #000000;
font-weight: bold;
padding-top: 3px;
}
.title {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;
color: #000000;
padding-top: 5px;
}
.hr {
height: 1px;
width: 385px;
color: #000000;
}
a:link {
color: #000000;
text-decoration: none;
}
a:active {
color: #000000;
text-decoration: none;
}
a:visited {
color: #000000;
text-decoration: none;
}
a:hover {
color: #C0C0C0;
text-decoration: none;
}
ul {
list-style-image: url(images/layout/ul.gif)
}
Tack på förhand,
Jakob
Hej och välkommen till wF!
En viktig fråga här är: varifrån kan du inte läsa din CSS-fil?
Laddar du upp det till en server på nätet för test eller kör du på en server hemma?
Det är nämligen så att vissa servrar gör fel och skickar en MIME-typ för CSS-filer som något annat än text/css. Och då blir FF sur och grinig, medan IE glatt säger "jag vet att du gör fel men jag gissar att det är det här du vill..."
Tyvärr så betyder det att du behöver tala om för serverägaren att dom borde ändra och lägga till korrekt MIME-typ för filer med ändelsen .css
Som tur är finns det ett trick även för dig och det är att du kan ändra DOCTYPE till någon som inte aktiverar strict-mode. Du får istället "quirks"-mode
Testa tex att lägga till
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
överst i din HTML-fil.
För övrigt, om du ändå ska ha Verdana 10px på alla dina element så kan du sätta den stilen på body istället. Vill du sedan ändra stil på hela sidan behöver du bara ändra på ett ställe. Var smart - var lat :)
Hej och välkommen till wF!
En viktig fråga här är: varifrån kan du inte läsa din CSS-fil?
Laddar du upp det till en server på nätet för test eller kör du på en server hemma?
Det är nämligen så att vissa servrar gör fel och skickar en MIME-typ för CSS-filer som något annat än text/css. Och då blir FF sur och grinig, medan IE glatt säger "jag vet att du gör fel men jag gissar att det är det här du vill..."
Tyvärr så betyder det att du behöver tala om för serverägaren att dom borde ändra och lägga till korrekt MIME-typ för filer med ändelsen .css
Som tur är finns det ett trick även för dig och det är att du kan ändra DOCTYPE till någon som inte aktiverar strict-mode. Du får istället "quirks"-mode
Testa tex att lägga till
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
överst i din HTML-fil.
Jag har en liknande kod överst i min fil:
<!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">
Ska den bytas ut mot det du skrev?
EDIT: Jag testade; det fungerar! Tack så mycket! :)
Men dock upptäckte jag ett nytt problem, även det kring CSS. Nu när jag har muspekaren över text, inte bara länkar, får den texten den färg som länkar får när muspekaren är ovan för, #C0C0C0. Dåligt förklarat, jag vet.
Någon som har någon idé?
Hej!
Bra att det funkade.
Det nya felet är svårt att rätta till utan att se koden, men sannolikt har du en <a>-tagg som du inte stänger på rätt sätt och därför blir det fel.
Har du sidan på någon server där vi kan titta på den i dess helhet så underlättar det enormt.
Annars så rekommenderar jag dig att installera FireFox2 med extraverktygen Web Developer, FireBug samt Tidy HTML Validator. Dessa gör ditt web-snickrande till en dans på rosor :)
Hej!
Bra att det funkade.
Det nya felet är svårt att rätta till utan att se koden, men sannolikt har du en <a>-tagg som du inte stänger på rätt sätt och därför blir det fel.
Har du sidan på någon server där vi kan titta på den i dess helhet så underlättar det enormt.
Annars så rekommenderar jag dig att installera FireFox2 med extraverktygen Web Developer, FireBug samt Tidy HTML Validator. Dessa gör ditt web-snickrande till en dans på rosor :)
Jag funderade vidare och kom fram till att det här problemet inte uppstod på samtliga sidor, endast dem med <a name="#"> innuti sig, de avslutar jag dock inte med </a>, borde jag det?
Narturligtvis borde du det :)
Allt efter <a> är en länk eller ankare fram tills </a>
Jag misstänker att stilmallen inte laddades in för att servern skickade filen som text/plain istället för text/css (se felkonsollen).
Narturligtvis borde du det :)
Allt efter <a> är en länk eller ankare fram tills </a>
Tack så mycket, det fungerar nu! :)
Och så har jag en fråga till...
Även den gäller skillnader i IE7 och FF...
Jag har en bild, på ca 850 px på bredden och 40 på höjden, därpå har jag en text. Denna text är inom <marquee>-taggar, i IE är den centrerad mot mitten på höjden (om ni förstår) men inte i FF, det är problemet. Någon som har någon idé? Om jag har en för tafflig förklaring får ni be om en bättre. :p
har du testat att sätta text-align:center; i din css?
har du testat att sätta text-align:center; i din css?
Japp, men det fungerade inte...
Här är den style-koden för den stilen:
.style4 {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;
color: #FFFFFF;
font-weight: bold;
padding-left: 5px;
}
När det gäller MARQUEE-taggen så är det så att den från början var en IE-specifik tagg och räknas till en av de "onda" taggarna, liksom BLINK och annat otyg, eftersom dom inte tillför någon semantisk betydelse.
Därför, tror jag, har man inte lagt ner speciellt stor kraft på att göra en bra implementation av hur MARQUEE skall renderas.
Idag skulle man nog istället välja en div eller span och sedan flytta på den med hjälp av javascript, om man nu måste :)
När det gäller MARQUEE-taggen så är det så att den från början var en IE-specifik tagg och räknas till en av de "onda" taggarna, liksom BLINK och annat otyg, eftersom dom inte tillför någon semantisk betydelse.
Därför, tror jag, har man inte lagt ner speciellt stor kraft på att göra en bra implementation av hur MARQUEE skall renderas.
Idag skulle man nog istället välja en div eller span och sedan flytta på den med hjälp av javascript, om man nu måste :)
Hur gör man det i JavaScript då? ^^
Sök på google på "javascript marquee" och finn tex
http://javascript.about.com/library/bltick2.htm
Så enkelt :)
vBulletin® v3.8.6, Copyright ©2000-2013, Jelsoft Enterprises Ltd.