Notifikationer

Markér alle som læst Log ud

noex Nybegynder

07. januar 2003 - 09:38 Der er 20 kommentarer og
2 løsninger

Centrering af en table

Følgende kode centrerer en tabel:

<table align="center" border="1" cellpadding="0" cellspacing="0" width="100">
<tr><td>content</td></tr>
</table>

Hvordan foretages centrering af tabellen vha. CSS?

Synes godt om

zeptic Nybegynder

07. januar 2003 - 09:41 #1

table{text-align: center;}

Synes godt om

lynx-dlk Nybegynder

07. januar 2003 - 09:44 #2

Her er en reference hvis du får brug for flere CSS tags :)

http://www.w3schools.com/css/css_reference.asp

Synes godt om

lynx-dlk Nybegynder

07. januar 2003 - 09:44 #3

Svar :)

Synes godt om

pelkjaer Nybegynder

07. januar 2003 - 09:51 #4

http://www.peterelkjaer.dk/exp/center.html

Synes godt om

noex Nybegynder

07. januar 2003 - 10:05 #5

Til zeptic:

Det virker ikke. Attributten text-align virker kun på block-elementer - ikke på inline elementer. Der findes en vertical-align i CSS spec.'en, men desværre ikke en horizontal-align.

Har du andet forslag?

Synes godt om

noex Nybegynder

07. januar 2003 - 10:06 #6

Til lynx-dlk:

Takker for linket. Jeg havde dog allerede været omkring W3C for at se, om jeg kunne støve noget op :-)

Synes godt om

noex Nybegynder

07. januar 2003 - 10:13 #7

Til pelkjaer:

Det, som du foreslår, er i princippet:

<div style="text-align: center">
<table style="border:1px dashed">
<tr><td>content</td></tr>
</table>
</div>

Dvs. at du smider tabellen ind i en div. Da text-align netop kun kan bruges på block elementer, er man tvunget hertil, hvis man skal bruge denne attribut.

Takker for forslaget, men jeg leder efter en løsning, hvor man ikke er nødt til at fnidre tabellen ind i en container. Beklager, at jeg ikke gjorde opmærksom herpå fra start :-)

Håber at du har en mere "ren" løsning ?

Synes godt om

zeptic Nybegynder

07. januar 2003 - 10:15 #8

Jeg har kigget lidt i dokumentationen for CSS2, og så vidt jeg kan se skal det gøres således:

<html>
<head>
<style>
table{
margin-left: auto;
margin-right: auto;
border-style: solid;
}
</style>
</head>
<body>

<table>
<tr><td>Dette er en test på centrering af tabel vha. CSS</td></tr>
</table>

</body>
</html>

Synes godt om

pelkjaer Nybegynder

07. januar 2003 - 10:24 #9

noex>>Nej det er ikke det jeg i princippet gør. Kig på det igen - det er måden at gøre det på hvis en alm. align="center" ikke kan bruges.

Synes godt om

noex Nybegynder

07. januar 2003 - 10:26 #10

Til pelkjaer:

Tak igen, men jeg kan ikke bruge en løsning, hvor tabellen indlejres i en div :-)

Håber virkelig på, at der findes en anden løsning.

Synes godt om

lynx-dlk Nybegynder

07. januar 2003 - 10:41 #11

Hvad er dit inline element?

Synes godt om

zeptic Nybegynder

07. januar 2003 - 10:42 #12

Mit eksempel ovenfor virker (ihverfald i Opera 6.04)!

Synes godt om

lynx-dlk Nybegynder

07. januar 2003 - 10:42 #13

Hvad hvis du laver en tabel giver din td en class="center"

og så i din css skriver
.center{
text-align:center;
}

Synes godt om

pelkjaer Nybegynder

07. januar 2003 - 10:43 #14

Jamen så slet div'en og giv tabellen id istedet, svære er det ikke ;)

<table id="content" style="border:2px #999 dashed;">
<tr>
<td>Her en en tabel</td>
</tr>
</table>

Synes godt om

zeptic Nybegynder

07. januar 2003 - 11:02 #15

Efter at have afprøvet mit eksempel i et par browsere, ser jeg følgende:

MSIE 6.0 centrerer ikke.
Phoenix 0.5 (bygger på Mozilla 1.2 kode) centrerer.
Mozilla 1.2.1 centrerer.
Opera 6.4 centrerer.
Opera 7.0 centrerer.

Det kommer altså også an på hvilken browser du benytter. Desværre bruger de fleste MSIE, og derfor kan du nok ikke gøre det du vil.

Synes godt om

pelkjaer Nybegynder

07. januar 2003 - 11:09 #16

Jo, skal jeg gentage mig selv endnu engang :)

http://www.peterelkjaer.dk/exp/center.html
(har fjernet div og givet tabel id)

virker i nyere IE/NS/Opera

Synes godt om

noex Nybegynder

07. januar 2003 - 11:16 #17

Til Pelkjaer:

Du skriver, at jeg kan slette div'en og give tabellen et id i stedet. Kan jeg ikke lige få til at virke. Kan du ikke give mig et link til en side, hvor det virker? I dit sidste link, er der nemlig stadig en div.

Synes godt om

niceday Nybegynder

07. januar 2003 - 11:18 #18

Den lette metode:

<div align="center">
Tabellen her
</div>

Synes godt om

pelkjaer Nybegynder

07. januar 2003 - 11:19 #19

Hvor er den div henne? http://www.peterelkjaer.dk/exp/center.html :)

Synes godt om

zeptic Nybegynder

07. januar 2003 - 11:22 #20

I noex' cache :-)

Synes godt om

noex Nybegynder

07. januar 2003 - 12:12 #21

Ro på nu :-) .......sorry

Har nu følgende kode:

<table style="border:1px solid; margin-right: auto; margin-left: auto;">
<tr><td>content</td></tr>
</table>

....eller man kan give tabellen en id, som defineres i en style blok.

Jamen det lader jo til at virke fint........hmmm. Men mærkeligt. Det er jo det samme som zeptic gjorde kl. 10:15:59, men da virkede det ikke i MSIE.

Takker mange gange for hjælpen !

Synes godt om

zeptic Nybegynder

07. januar 2003 - 12:29 #22

Der skal en DOCTYPE på, så virker mit eksempel også i MSIE. Hele eksemplet bliver så:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<style type="text/css">
table{
margin-left: auto;
margin-right: auto;
border: 1px solid;
}
</style>
</head>
<body>

<table>
<tr><td>Dette er en test på centrering af tabel vha. CSS</td></tr>
</table>

</body>
</html>

Synes godt om

Ny bruger Nybegynder

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.

Følg dette spørgsmål

Opret Preview

Webudvikling kurser

Vi tilbyder markedets bedste kurser inden for webudvikling

Se alle Webudvikling kurser

Flere spørgsmål fra HTML kategorien

Titel	Indlæg	Oprettet	Seneste aktivitet
Hjælp med HTML og CSS Af Nojsa i HTML	18	10/09/202515:07	17/09/202515:11
CSS 2 x firkanter + tekst på samme linje Af nemlig i HTML	3	19/03/202522:16	20/03/202513:04
Se og ændre html på en webside Af magger i HTML	4	11/03/202513:55	12/03/202506:56
Få input felt, der er med fed skrift og formatteres på linje Af KurtG i HTML	5	02/03/202520:05	04/03/202515:40
Variabler som ikke virker Af Frits Jensen i HTML	3	30/10/202409:37	01/01/202515:27

Se alle spørgsmål i kategorien Opret spørgsmål

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester

Alle kategorier på Eksperten

Seneste artiklerRSS