Vi har ju ID och class att välja på och för att undvika krångel så mycket som möjligt använder jag nu alltid ID, aldrig class. Jag vet att ID ska använda när det bara förekommer en gång och class vid flera förekomster. Eller var det tvärtom? :blink:

Jag har aldrig haft några problem med detta, sidorna visas som de ska och koden validerar. Och jag behöver inte hålla reda på när det ska vara . eller # i CSS:en, nu vet jag att det alltid är #.

Kan någon komma med någon anledning till varför detta skulle vara fel?

För att det är fel. Visas säkert fel någonstans i någon webbläsare. Följ standarden så slipper du problem i framtiden. Det är dessutom mycket skönare att kunna skilja på "dynamisk design" och "statisk design".

Det är precis som du säger. Id används en gång, och class skall användas när du har element du vill cssa fler gånger.

Tack för svar men är inte övertygad.

Grejen är att jag skriver en guide om CSS för nybörjare och det vore så mycket skönare kunna att skriva "använd ID" istället för "använd ID då och då och annars Class" i denna guide där läsaren redan har fullt upp med att lära sig nya saker.

Keep 'em coming.

Om jag skulle välja så skulle jag välja class, id är starkt begränsat i användbarhet jämfört med class..

Varföt lära ut fel när man kan lära ut rätt?

Skulle även vara kul att veta hur du lyckas validera en XHTML sida med flera likadana ID

Du citerade svaret på din egen fråga.

Ok, class är bevisligen ett bättre val än ID då flera likadana ID inte blir validerat. Men, kan någon ge någon bra förklaring varför man inte alltid skulle använda class då?

document.getElementById('lol'); ???

ID ska användas när elementet förekommer en gång. Class ska användas när element förekommer flera gånger. Om du ska skriva dokumentation och är orolig för hur läsaren kommer att reagera på att använda "#" vs. "." hur förvirrade kommer de då inte bli av alla andra selectors? Skriv hellre isåfall att för enkelhetens skulle använder vi oss enbart av klasser, även om det inte är rätt och det finns många andra sätt att träffa olika element med css:en.

IDn och klasser har även olika "vikt" (specificitet) vid arv och cascading.

Klasser kan, som tidigare nämnts, användas flera gånger och är då bättre att använda för generella saker som återkommer i sidan. T.ex. en paragraf med text som ska ha en viss färg, ett visst typsnitt, en viss bakgrundsbild och en viss storlek. Denna texttyp kanske man vill återanvända på flera olika ställen i sidan och då blir det snabbt omständigt med ID.

Om det finns en av dessa paragrafer som ska ha utseendet ovan men även en annan bakgrundsbild, ja då är det väldigt bra att kunna först ge paragrafen den generella klassen, och sedan ge den en flummig bakgrundsbild med en ID (det går såklart även med en till klass, men då måste man se upp vart i CSS:en man placerar klassen så den inte skrivs över).

Det finns även fler anledningar till att båda bör användas. T.ex. kan du länka till element med ett ID, men inte ett med en klass.

Slutsats: Båda behövs, lär ut rätt från början, annars gör du dem en björntjänst!

Här är några länkar där du kanske hittar lite mer info:
http://www.tizag.com/cssT/cssid.php
http://www.w3.org/TR/CSS21/selector....elector-syntax
http://css-discuss.incutio.com/?page=ClassesVsIds

Det hela är egentligen ganska enkelt.

Class skulle man kunna kalla grupp. När du har flera olika element som ska ha samma egenskaper kan du använde en class.

Id ska vara en unik identifierare. Du kan använda de båda i kombination.

Tänk dig att du har fem knappar. Alla knappar är likadana med undantag för en knapp som är röd.

Du kan då använda class för att sätta de gemensamma egenskaperna på alla knappar och så id på den röda knappen för att göra den röd.

Ett element kan också ha flera klasser men bara ett id.

Vid användning av ankarlänkar:
http://www.dinsida.se/lol.html#AnkarID


...eller kanske mest för att slippa problem då du t ex vill override:a en klass:

Dvs ID har högre specificitet än class vilket kan vara väldigt användbart för att slippa trassla in sig i överlagringar och onödigt användande av !important.

CSS + ID fungerar inte i Safari

eh, jo... iallfall i vintras när jag hade en mac till låns. osx10.4 med safari 3.

Safari 3 ja, men Safari 2 fungerade det dåligt.

Utav dom mac användare som använder Safari på mina websidor så använder 85% fortf. Safari 2.

Vad är det för trams? id fungerar utmärkt i Safari ända sedan de första versionerna (du kanske använder css fel som Thir13teen)

Eller menar du selektorn +? (Lite oklart uttryckt vad css+id betyder…)

En del mer avancerade pseudo-element som :first-letter fungerade däremot inte i den första versionen av Safari (som knappast används längre).

Thir13teen: Lär dig använda css korrekt, särskilt om du vill lära ut det, annars är risken stor att du får märkliga underliga "fel" helt oväntat. CSS är som en verktygslåda, desto fler verktyg du kan använda desto skickligare är du.

Vilken märklig diskussion =)

Ska du skriva en guide om CSS så tycker jag väl att du bör sträva efter att ge läsaren korrekt information och inte vilseleda eller förvirra.

Har du att välja mellan "alltid id" eller "alltid class" så är givetvis det senare att föredra. Om du behöver komma åt elementen via Javascript, vilket ofta är högst relevant vid något tillfälle, så slipper du då göra några ändringar utan kan bara lägga till ett id på aktuella element. Id är till för unik identifiering och ska aldrig dupliceras medan class är mer direkt relaterad till css och designen i stort.

Du verkar vara en viktigpetter av sällan skådat slag, komplett med värdelös metafor om CSS som en verktygslåda och prat om att :first-letter inte fungerade i Safari 1 för att visa att du minsann kan allt om Internet.

I sann Sverige-anda ignorerar folk att jag sa att jag vill kunna förklara det så enkelt som möjligt för en nybörjare och hävdar att det är vilseledande, att jag inte kan CSS o.s.v. Det var precis vad jag väntade mig iofs.

Men jag vet hur jag ska skriva i min förklaring - att man ska börja enkelt med en av de två (class, that is) men sträva efter att använda båda korrekt.

Även om det var ett lite aggressivt inlägg så är Martine en av de mest kunniga på forumet inom webbprogrammering så du kanske borde försöka lära dig lite av honom istället för att sjunka till en ännu lägre nivå... Om du inte beskriver skillnaderna mellan de bägge så kommer du sannolikt förvirra och vilseleda mer än du lär ut. Det är trots allt ganska simpelt att lära sig även för en nybörjare....

martine: Har aldrig upplevt det själv utan det har hela tiden varit en kund åt mig som använt safari som skickat mängder med skärmdumpar där jag använt css isamband med <div id="">. då som (#id { background-color: #ffffff; } ) tex.

När ja bara ska anropa en gång så skriver ja koden direkt så här:

div style="margin-top:10px;font-family:tahoma"></div>

är det en div som kommer flera gånger så använder ja klasser.

lite jobbigt för andra att läsa koden, men orkar inte bry mig om det:P

Fick du samma problem om du hade kvar id men satte designen på en klass istället?

Det låter lite märkligt, jag har aldrig hört talats om det eller varit med om det själv trots att jag beta-testat i Safari ända sedan version 1.3. Är du säker på att det inte är något fel i koden?

Har du lust att länka till sidan? (Eller skicka ett pm.)

Jag skulle gärna vilja se några riktiga kodexempel där det inte fungerar. Vanligtvis fungerar det ju. Om det nu verkligen är en bugg i Safari vore det bra att ha koll på den. (I 90 % av fallen är det man själv som råkat ställa till det - jag var nyligen helt övertygad om att jag hittat en bugg i php:s xsl-funktioner, men det var förstås en egen miss…)

Vad är det du menar att jag skulle lära mig av hans inlägg? Hans inlägg handlar är inte ens on-topic, bara att jag och Jonas inte kan CSS samt något om Safari 1. Misshandlanda inte min tråd.

Sasser: som du redan verkar förstå är det sättet fel av flera olika anledningar, även om det funkar. Gör inte så :P

Varför skulle det vara fel?

Pga att det inte såg korrekt ut för min kund så var jag tvungen att skriva om css koden och använda "classer" istället.

Nu om jag har ett element som jag vill ta bort tillfälligt öppna HTML

Lägg till en class i tagge <div id="div-tag" class="align-left hidden" />.

Så använder jag classes ofta utöver design.

Så mitt tycke att inte använda class är en nackdel.

En annan fördel är att använda Firebug och ha egna standard classer, sedan inspecta och ändra classen direkt i browsern för att se om det är bättre att göra den lilla ändringen.

debug.css har jag döpt min class sammling till. Ville bara säga det :)

Du menar sättet som sasser nämnde? Jadu, t.ex. så blandar man ihop design och innehåll vilket är precis det man försöker undvika när man använder sig av CSS. Om du använder CSS i ditt HTML-dokument för att formatera text blir koden grötigare och mer svåröverskådlig, vilket är dåligt både för den som jobbar med hemsidan samt när sökmotor-crawlern kommer och letar i din sida efter innehåll. Det var bland det första jag fick lära mig. Eller menar du nåt annat?

I princip har du rätt men det kan i vissa fall ändå vara smidigare att sätta style-taggen direkt i html-koden. Om man har en del element som bara förekommer enstaka gånger så föredrar jag att göra på sassers vis då man slipper fylla sin css med en massa onödiga element och istället göra den oöverskådlig.

Det är sällan det finns en enda universallösning som alltid är rätt utan man får ofta väga fördelar mot nackdelar utifrån sina förutsättningar, vilket de här som pysslar med databasdesign vet mer än väl.

Jag skulle nog tippa på att det handlade om något fel i htm/css och inte i Safari... :rolleyes:

Jag har inget som helst intresse av att skryta om min kunskaper. Det för övrigt fullständigt struntsamma för min del hur bra du eller någon annan kan css. Du ställde en fråga här på forumet så jag tog mig friheten att svara - om du inte är intresserad av mina åsikter så strunta i dem. Lycka till med din guide.

PS meningen "som du redan verkar förstå är det sättet fel av flera olika anledningar, även om det funkar. Gör inte så" verkar också ganska viktigpettermässig... :blink:

Läs och lär:

http://www.456bereastreet.com/archive/2005...lectors_part_1/


och sluta bråka :P

Det är precis det den här tråden handlar om. Självklart finns både id och class av en anledning men när jag själv väger fördelar mot nackdelar när de gäller att lära en nybörjare om selectors så kommer jag fram till att det är lättare att prata om endast en av dem, för den som ska lära sig's skull. Jag tänkte "Jag vet väl att det inte är 100% rätt att bara använda class eller id, men i 99% av fallen funkar det ändå. Eller hur?". Men då kom viktigpetter-fingrarna fram och sa att "nej, så gör minsann inte proffsen", utan att ha vägt fördelar mot nackdelar.

Angående många olika element skulle jag hellre "cluttra" min CSS istället för HTML men det kanske är en smaksak (<- Läs: det är det tamefan inte, du skall ICKE ha CSS inne i din HTML, men om jag säger det så låter jag som en viktigpetter så jag struntar i det).

Det var just det som den inte var eftersom jag sa "Som du redan verkar förstå..." vilket betyder "Jag försöker inte hävda att jag kan mer än dig".

Jag förstår din poäng men problemet är att bägge är så nödvändiga att det verkar dumt att lämna ute den ena eller andra även om det riktar sig till nybörjare (trots allt har de sannolikt viss html-kunskap redan om de ska sätta sig in i CSS för vilket detta är ytterst basic-kunskap som är oumbärlig). Du skriver att i "99% av fallen funkar det ändå" men det gör det inte. Jag själv gör i princip aldrig sajter där jag inte behöver (eller vill ha) ID men skulle jag enbart använda ID så fungerar det givetvis inte alls.

Koden var W3C validerad samt fungerade i MSIE, Opera & Firefox i dom versioner som var aktuella när detta skedde (2005-2007)

id används ju också som ankare, vilket är en stor nytta för användaren.
Man skulle kunna komma undan med endast IDs och ha en sjysst semantik utan att ha alltför plottrig CSS. Själv föredrar jag att faktiskt att använda båda.
Roger Johansson is the man på dessa saker, så översätt hans text och ange källhänvisning.

Okej. Men Safari har haft stöd för id-selectorer sedan den första versionen 1.0 dvs sedan 2003 så det felet beror inte på att Safari inte stöder id-selektorer. Kanske berodde det på någon gammal cachad css-fil eller liknande. Det är i alla fall extremt osannolikt att du upptäckt en Safari-bugg för något så vanligt som id-selectorn som ingen tidigare märkt.

En länk eller ett exempel där felet återupprepas vore intressant som sagt.

(Safari 2 är ungefär lika kapabel som Firefox 2 och av den anledningen är det ovanligt att man får problem med enklare selektorer där. Suck, nu blir jag väl kallad viktigpetter igen... :huh: )

Jag säger som jag har sagt ända från början, varför inte lära ut det korrekta sättet att göra något på från början.
Det är mycket svårare att ändra ett felaktigt beteende än att lära sig rätt från början.

Att lära sig att använda id och classer på rätt sätt är väl bland det mest grundläggande man ska börja med i CSS tillsammans med "cascading order" (ibland är svenska svårt).

Att använda style i html är ett "big no no" men som alltid så finns det undantag, har man 20 sidor och på varje sida så finns det ett element som är helt unikt för webbplatsen så finns det ingen anledning att kladda ner CSSen med 20 olika classer/idn som bara gör CSSen mer komplex.

Nu dök det visst upp en viktigpetter till i tråden.

Flödesordning är kanske en bra term? (Det är ju hopplöst när man blir tvungen att använda engelska hela tiden…)

/Viktigpettern :D

Är det inte enklare att dela upp CSS:en i flera filer och lägga det som sällan används i en fil eller i en fil per sida eller vilket som. Det blir fortfarande kod som är enklare och trevligare att läsa.

Appropå viktigpettrar, om du inte vill ha svaret bör du undvika att ställa frågan.

Eftersom du uppenbarligen inte läst hela diskussionen/tråden så tycker jag inte att du ska kommentera den.

Till de andra: har man relevant information/åsikter att dela med sig utan att använda sig av nedlåtande ton är man självklart inte någon viktigpetter.

Vill bara tillägga att om du tänkt dig använda JS på sidan (beroende på vad du nu ska göra) så är kanske ett JS ramwerk (ex. jQuery) något för dig, speciellt om du vill selecta element med en viss klass.