24. juni 2009 - 16:01Der er
14 kommentarer og 1 løsning
Fordele ved at bruge CSS position, i stedet for HTML tabeller?
Hej Eksperter!
Jeg har i et par år lavet hjemmesider nu, mest som et fritidshobby, og elsker det!
Men jeg har altid lavet mine hjemmesider på den samme måde, og (mange af jer ville nok sige desværre) opbygger mine designs med HTML tabeller.
Jeg har efterhånden fået afvide af 100 personer nu at jeg skal til at bruge CSS position i stedet på f.eks et div tag, men har aldrig kunne se grund til at skifte? Folk fortæller bare at det er nemmere, og hjemmesider jeg har fundet som forbyder tabeller til andet en tal og statistikker, kommer også kun med begrundelsen at et div tag + lidt css er lettere? Men hvad er den egentlige grund?
Jeg har været lidt modvillig til at skifte til div tags + css, fordi at med tabeller strækker flere celler sig automatisk, når indholdet i f.eks den midterste celle ud af 3 bliver for stort. Kan man gøre dette med div tags, hvis de er placeret ved siden af hinanden?
Det er med tabeller og divs som med så mange andre ting i denne verden - der er fordele og ulemper ved begge dele, der er nogle ting man ikke kan løse i den ene men som er let i den anden )i hvert fald hvis man vil undgå en masse hacks), man lægger bare sjældent mærke til ulemperne i den måde man selv har valgt at lave opbygningen fordi de er blevet en naturlig del af ens arbejde.
Helt grundlæggende kan det siges, at den klart bedste begrundelse for at benytte divs fremfor tables er, at divs er beregnet til at opsætte layout hvorimod tables er beregnet til at opsætte tabullerede data (deraf navnet). Tables er altså ikke, modsat hvad en del artikler nok skriver, ikke forbudt at bruge - de skal bare bruges til det de er beregnet til ligesom ethvert andet element i HTML. Opsætning med divs betyder bla mindre kode ud til klienten og større chance for en pænere opdeling mellem kode (altså ens divs) og styling (altså css).
Det problem du beskriver omkring højde på divs er klart et af de første problemer man støder på - men der er ikke én måde at løse det (og eventuelle andre udfordringer) på da det afhænger både af opsætningen og hvad det ønskede resultat skal være, mest logisk kunne fx være at pakke dine 3 divs ind i en omkringliggende div og sætte baggrundsbilledet på den fremfor hver af de 3 divs så man ikke lægger mærke til højdeforskellen.
Havde egentlig nok godt forstået at det ikke var forbudt at bruge tables, hvilket også lidt er grunden til at jeg ikke har skiftet noget før.
Men da mine designs for det meste er opbygget af et banner, 1 venstre, midter og højre boks i en tabel, gør det det svært at lave med div tags.
Og som jeg forstår på dig, er det ikke muligt at lave sådan at 3 divs ved siden af hinanden, præcis har samme højde konstant, som i en tabel? Hvilket ærger mig lidt, fordi jeg har prøvet at arbejde med div, og position, og godt kan se fordelene!
Hvis man læser på w3.org (dem der udarbejder html, xml og css standarden) finder man ud af at css skal styre det typografiske, html styrer indholdet og javascript bruges til at forandre indholdet og typografien dynamisk. De skriver desuden om hvorfor man bør bruge div og span frem for table :-)
Grunden til at fravælge tables er også at hver browser har hver sin definition af hvordan en tabel skal se ud - de har de ikke om en tom skal (div og span er som standard uden egenskaber) :-)
Jeg har aldrig selv haft behov for at sætte flere divs til samme højde - det er altid løst som fx beskrevet i min første kommentar. Spørgsmålet har dog været rejst utallige gange her på Eksperten, så mon ikke der ligger lidt muligheder, og dermed også nogle løsninger, rundt omkring.
Mcb2001: Tak for svaret. :) Det giver mere mening nu. :)
Keysersoze: Jeg er ikke i tvivl om at andre har spurgt om det, kunne bare ikke lige finde nogle svar der besvarede mit spørgsmål. Har prøvet dit første forslag til at løse problemet, og syns ikke det er tilfredsstillende, så den eneste mulighed er vel at hvis man vil lave lige præcis den type design, er tabeller den eneste mulighed.
så kom med et forslag på den nye kode, fortæl hvad du mangler og lad os se om det kan løses anderledes - som sagt kan der ikke én møde at løse tingene på og uden at kende problemstillingen til bunds er et svar umuligt.
Der er ingen mulighed for direkte at oversætte dit setup til divs for du kan ikke benytte vertical-align i en div. I min verden er dit setup dog også et relativt tænkt eksempel forstået på den måde at det nok ikke er at udseende man ville stræbe efter i mere professionelle setups - eller også har jeg bare været heldigt forskånet for den slags.
Når det så er sagt er jeg rimelig sikker på at det nok kunne løses alligevel enten ved at tænke i lidt alternative baner omkring hvordan man placerede og ikke mindst stylede sine divs eller vha javascript - men det kan være andre kan svare på det.
Har førhen prøvet at få mig selv til at skifte til at bruge divs, men støder hele tiden på et problem som jeg ikke kan løse med div tags, men kun tabeller. Dog er jeg aldrig stødt på et problem med en tabel, som jeg kunne have løst med et div tag (ihvertfald hvad jeg mindes).
Glemmer altid brugen af doctype, så det er godt du nævner det. ;) Sad selv om læste denne side igår, som er ekstrem bruger venlig: http://www.htmldog.com/guides/htmlintermediate/badtags/ Det er skrevet så enhver kan forstå det, det handler dog kun om HTML tags, og ikke om doctypes.
Som sagt - hver ting har sine fordele og ulemper, meget omkring web er jo i bund og grund forældet og slet ikke beregnet til de designs vi opbygger i dag. Jeg ville aldrig skifte divs ud til fordel for tables - men der kan (og vil) selvfølgelig være situationer hvor tables er mere hensigtsmæssige.
Det lyder for mig som om du søger grunde til ikke at skifte og kun ser problemer i stedet for udfordringer. Du har angivet ét setup der ikke er bare lige (bemærk, ikke umuligt) at sætte op sætte op med divs og derfor holder du fast, men det kunne jo tænkes at de 10 andre setups du kunne komme ud for fint passer til divs. Hvis du laver en side for sjov er det selvfølgelig i bund og grund ligegyldig hvordan koden er - bare det virker, udfordringerne kommer så først i det øjeblik man måske skal leve af det for her er det ikke altid ligegyldigt hvordan man strukturerer sin kode og så kan man lige så godt øve sig inden man når dertil. For at hive en kliché frem - Rom blev ikke bygget på én dag... og ingen lærer hverken HTML eller opsætning med divs på en dag.
Du har nok lidt ret i at jeg leder efter en grund til ikke at skifte. ;) Leder efter et "Godkendt" stempel på HTML tabeller i brug af designs. heh. Men jeg må bare ud fra mit design beslutte for om der er brug for tabeller, eller om det kan laves i DIV's.
Er skam heller ikke lige begyndt på HTML. Har været igang i nogle år, og alt det som nu er dårlig kodning, er desværre det som har sat sig fast på hjernen. Tager sikkert et års tid at vænne sig af med igen.
Kan ikke helt finde ud af hvad jeg gør med points i dette spørgsmål? Men de må vel gå til dig keysersoze for klart størst deltagelse, og hjælp i mine dybe overvejelser! :)
Jah okay, det kan jeg forstå på det hele. :) Men tak for svarene! :)
Synes godt om
Ny brugerNybegynder
Din løsning...
Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.
