Hej. Jag ska centera en tabell med hjälp av CSS. Det vill sig inte.
Jag har testat att lägga tabellen i en <div>, att lägga text-align: center; i diven, i body och i tabelltaggen. Inget fungerar i netscape/Mozilla/phoenix, bara i IE.
Måste jag använda align-attributet? Jag vill göra den här sidan i XHTML Strict :-(
Hjääälp..!
centera tabell
8 svar · 497 visningar · startad av Gjutjärn
Hade du med margin:auto ?
Detta funkar i Moz1.1 iallafall (och validerar ;) ) :
<?xml version="1.0" encoding="ISO-8859-1"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="sv" lang="sv">
<head>
<title>tabellcentrering</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
</head>
<body>
<div style="text-align:center">
<table width="100" border="1" style="margin:auto;text-align:left;">
<tr><td>Ett</td><td>Två</td></tr>
<tr><td>Ett</td><td>Två</td></tr>
</table>
</div>
</body>
</html>
hej
Tack, det ska jag testa.
Vad innebär margin: auto; ?
Jag har en jättetjock bok om XHTML, men allt är då visst inte med....
Jag har en jättetjock bok om XHTML, men allt är då visst inte med....
Det beror nog på att margin:auto är CSS ;)
Hursomhelst:
Med CSS kan du ställa in marginaler på fem olika sätt...
Du har dels
margin-top:
margin-left:
margin-right:
margin-bottom:
för respektive "kant" på ett block, och dels kortformen
margin:
som ställer in alla fyra på en gång...
För varje marginal kan du ställa in ett värde, och det kan du i sin tur göra på flera olika sätt...
Absolut mått: 20px, 2cm, 20mm m.fl måttenheter.
Relativa mått: 20%, 2em m.fl måttenheter
Dessutom har du värdena "auto" (överlåter till webbläsaren att räkna ut ett bra värde) och "inherit" ("ärver" marginalbredden från omgivande block - men stödet för "inherit" är sparsamt... Moz stöder det iallafall ;) )
stilen
width:200px; margin:auto
på en div betyder margin:auto alltså ungefär "ge mig en 200px bred div, och räkna ut marginalerna automatiskt".
Själv lärde jag mig det trixet på http://bluerobot.com/web/css/center1.html
hej
ok, tack för tipset i alla fall. Det var bra.
Min XHTML-bok har 45 sidor om enbart CSS, plus att varje gång element ska formateras i något kapitel, så visas det både med attribut och med CSS-egenskaper.
I slutet av boken finns dessutom 15 sidor med CSS-egenskaper listade.
Jag hittade faktiskt auto där, för margin. Inte inherit, och inte heller någon förklaring till auto. Auto är inte heller med i tabellkapitlet (som också det är omfattande och stort för övrigt).
Jag tycker nog att de borde förklara lite mer om vissa CSS-grejer.
Vill man däremot hålla på och trixa med border, så finns nog exempel på varenda möjlighet (utom dotted ;)) i boken :)
Har du annars något bra tips för bra bok om CSS?
Jag har Wrox boken "Börja med XHTML" på över 700 sidor. De kanske har en motsvarande för CSS.
Tack för din hjälp med att centera tabellen! Det kändes bra att få problemet löst.Så här ser det ut nu: http://home.swipnet.se/emilclaeson
Ledsen, men jag har inget bra tips på böcker... jag är en såndär specifikationsläsare ;) Men de Wrox böcker jag har läst i har varit helt OK ;)
Om du (eller någon annan trådläsare) vill läsa mer om orsaken till varför margin:auto behövs vid blockcentreringar och detaljerna om varför det blir som det blir (det är alltså så att Moz/NN gör "rätt", och att MSIE verkar tumma lite på tolkningen av CSS2-standarden i detta fall) , så finns den på http://www.w3.org/TR/REC-CSS2/visudet.html#q6 .
Jag är ingen hejare på CSS men jag ser ett fel på din sida, knapparna ligger fel. Nyfiken på vad felet är men det får du snart svar på från någon annan?!
Glömde!! - IE6.0 win kör jag
knappar
Hej. Jo jag håller på och testar lite olika saker.
Men jag har råkat ut för att knapparna legat fel en gång, fast det rättade till sig då jag reloadade. Jag har också IE 6, bl.a.
Den adress jag skrivit ovan är inte den jag jobbar med, utan för att personen som ska ha sidan ska välja logo mm. Den här adressen innehåller det senaste från sidan. Observera att länkar inte är fungerande än. Bara gästbokslänken är klar.
http://home.swipnet.se/emma_c-c/emil