Riktiga tables med divvar

Avdelningen för webbrelaterad programmering och grafisk design.
Post Reply
User avatar
fisk
Posts: 7485
Joined: 2003-03-18 21:09:30
Location: Örebro / Sverige
Contact:

Riktiga tables med divvar

Post by fisk »

Säg att jag vill göra en tabell med 10st kolumner och 10st rader utan tabeller som ser precis ut som en standardtabell med värden, men jag INTE vill att det skall vara gjort med tables, utan div'ar. Därtill vill jag att detta skall validera med XHTML Strict, och inte använda mig av en uppsjö med enskilda definitioner i CSS:en.

Målet med denna uppgift är att göra om följande sida:

http://blah.enquilon.com

Så att den inte använder sig av tables. Går detta utan att drunkna i klassnamn och tokigt många CSS-definitioner, samt att det blir valid i W3C?
Aotearoa - tino rangatiratanga
User avatar
linc
Administratör
Posts: 7602
Joined: 2002-02-13 22:22:11
Location: Skåneland
Contact:

Re: Riktiga tables med divvar

Post by linc »

Nu kan jag inte det här, men "ska" man inte använda tables om det är en tabell med värden man vill ha?
hej.
User avatar
lither
Hedersbit
Posts: 9507
Joined: 2002-03-09 21:12:13
Location: Göteborg
Contact:

Re: Riktiga tables med divvar

Post by lither »

Fredrik Ågren wrote:Nu kan jag inte det här, men "ska" man inte använda tables om det är en tabell med värden man vill ha?
Det stämmer.

Men i mina ögon så ser det ut som om du, fisk, är ute efter att varje div, förutom den längst till höger, ska ha float: left, medan den till höger ska ha clear: left. Därtill får du ange fast bredd på allting och nollställa all margin. Exempel:

HTML

Code: Select all

<div class="leftdiv"><strong>Kaksort</strong></div><div class="leftdiv"><strong>Kaklängd</strong></div><div class="rightdiv"><strong>Innehåller gluten</strong></div>
<div class="leftdiv">Hallongrotta</div><div class="leftdiv">23 cm</div><div class="rightdiv"><strong>Oja!</strong></div>
<div class="leftdiv">Pepparkaka</div><div class="leftdiv">14 mm</div><div class="rightdiv">Helst inte</div>
CSS

Code: Select all

div.leftdiv {
float: left;
width: 120px;
margin: 0; }

div.rightdiv {
clear: left;
width: 120px;
margin: 0; }
Jag förstår dock inte varför du skulle vilja arbeta på detta sätt. Jag skulle vara mer mån om att köra med tabeller här i stället för divar, än att koden validerar. Du kan ju även med tabeller ange tabellhuvuden, med specifika rubrikstilar och dylikt.
1. Nigger guy, two words which by themselves are harmless, but when combined they form a verbal missile of hate.
2. Vivaldi
3. Buffalos ...
User avatar
madr
Posts: 998
Joined: 2004-08-24 11:12:39
Contact:

Re: Riktiga tables med divvar

Post by madr »

Jag skulle vara mer mån om att köra med tabeller här i stället för divar, än att koden validerar.
Koden kommer att validera med tabeller också. Tabeller är inte förbjudet att använda i någon DTD.

Något annat att ha i åtanke:
http://www.456bereastreet.com/lab/equal_height/ och

Funkar dock inte likadant i alla webbläsare då IE upp till version 7 inte har tillräckligt stöd, men det går att kompensera litet iaf:

http://www.456bereastreet.com/lab/equal_height_ii/

Jag ansluter mig till skaran och säger att de tär semantiskt korrekt att använda tabeller i det här fallet dock. Matriser av data där rader och kolumner förhåller sig på ett visst sätt är ett klockrent case där <table> ska användas.
antlion: 3,2 GHz i7 | 32GB | 180GB+120GB SSD SATA III | 2TB SATA III | Dell u2410 | GF 5600ti Arch linux + Win 7
User avatar
lither
Hedersbit
Posts: 9507
Joined: 2002-03-09 21:12:13
Location: Göteborg
Contact:

Re: Riktiga tables med divvar

Post by lither »

madr wrote:
Jag skulle vara mer mån om att köra med tabeller här i stället för divar, än att koden validerar.
Koden kommer att validera med tabeller också. Tabeller är inte förbjudet att använda i någon DTD.
Det vet jag. Jag bara presenterade hur jag skulle prioriterat, jämfört för det som fisk skrev. Validering är långt ifrån allt. Det är betydligt viktigare att skriva tillgänglig och semantisk HTML.
1. Nigger guy, two words which by themselves are harmless, but when combined they form a verbal missile of hate.
2. Vivaldi
3. Buffalos ...
Post Reply