rikard81 skrev:
Har bara lagt grund. Men här är sidan. Den ser helt annorlunda ut i Firefox då till och med den övre boxen försvinner?
http://hem.bredband.net/b503624/
Tack, det var bättre. Nu ser man nämligen allt du gjort, och det finns en del hel konstigheter där som påverkar menyn och resten av sidan. Här är några saker du bör titta på:
1. Sidan har ingen doctype (DTD). En doctype talar om hur webbläsaren ska tolka koden. Har du ingen sån, så faller webbläsarna in i "quirk's mode" och renderar koden lite hursomhelst ibland.
Läs här:
http://www.alistapart.com/stories/doctype/
http://hsivonen.iki.fi/doctype/
http://www.w3schools.com/tags/tag_doctype.asp
2. Du har css både i sidhuvudet och som separat stilmall. Lägg alla stilar i den separata stilmallen så har du dom på ett ställe.
3. Du har flera ställen i stilarna där du formaterar "body". Några säger emot varandra, t.ex. har du olika fonter. Gör helst en enda plats för formateringen av samma element.
4. Du behöver inte ange fonter för alla element om du ska ha samma i hela sidan. Tala om för "body" vad du vill ha för font, så "ärver" alla andra element samma inställning. Bara där du vill ha annorlunda fonter anger du det.
5. Du har ett par klamrar, alltså } som ligger lösa i stilmallen. Dom gör att koden i mallen inte stämmer och kan mycket väl förvirra webbläsaren.
6. Om du vill ha sidan centrerad, så borde du ha en "wrapper", dvs en div som omsluter ALLT innehåll, åsså centrerar du den och ger den gärna en relativ position ifall du senare vill positionera andra divvar inuti med exakta värden. Så här:
<body>
<div id="wrapper">
Innehållet här.
</div>
</body>
Åsså ger du den en stil typ:
#wrapper {
text-align: left;
margin: 0px auto;
padding: 0px;
width: 700px;
position: relative;
}
7. Vad du har för avsikt med divven "sidkant" förstår jag inte. Tänkte du att den skulle hjälpa till att centrera sidan? I så fall, ta bort den och ge divven "wrapper" den bredd du vill att sidans innehåll ska ha.
8. När det gäller menyn, så är det lite mer komplicerat, och du måste förstå vilket element du ska formatera eftersom det ingår 4-5 olika taggar (element) som påverkar; <div><ul><li> och <a>.
Nu har du formaterat <ul>"#meny" väldigt mycket. Den behöver du nästan inte röra mer än att ge den en marginal och padding på noll (eller annat värde om du vill ha det).
Det är istället taggarna <li> som bl.a. ska ha "float". Sen bör du formatera a-taggarna i relation till <li> så att andra a-taggar inte kommer att påverkas. Ungefär så här:
#meny li a {
color:#000;
text-decoration:none; }
#meny li a:hover {
color:#fff;
text-decoration:none; }
Det är i alla fall lite att börja med.
Jag föreslår att du pluggar lite mer. Kolla in bl.a. webbdesignskolan.com. Försök också att vara mer noggrann. Slarviga grejer som att ha samma tagg formaterad på fler ställen med motsägande data, och att ha lösa tecken inne i en stilmall är i 99,99% av fallen en garanti för att en sajt ska krascha och inte fungera. Har du dessutom mycket kod, så är det snudd på omöjligt att hitta såna här fel.
Lycka till!
