Notifikationer

Markér alle som læst Log ud

netro Nybegynder

27. maj 2006 - 19:02 Der er 14 kommentarer og
1 løsning

Ramme på tabel

Hvordan opnår man den samme effekt med CSS som med:

<table border="2" bordercolor="#000000"> ?

Man kan selvfølgelig style hver enkel celle for sig og sætte border-collapse til collapse i table-tagget, men er der ikke noget mere smart? Hvis der er cellspacing, virker border-collapse jo heller ikke optimalt.

Synes godt om

davidfossil Nybegynder

27. maj 2006 - 19:24 #1

AFAIK er border-collapse løsningen. Hvor er det lige du finder cellspacing i CSS?

Synes godt om

apo Praktikant

27. maj 2006 - 19:25 #2

CSS:
#mitTable {
border:2px solid #000000;
}
#mitTable td{
border: 1px solid #000000;
}

HTML:
<table id="mitTable">
<tr>
<td>ttt</td>
<td>ttt</td>
</tr>
<tr>
<td>ttt</td>
<td>ttt</td>
</tr>
</table>

Synes godt om

netro Nybegynder

27. maj 2006 - 19:46 #3

davidfossil -> Den findes ikke.

aop -> Det er udmærket, men jeg glemte at sige, at det helst skal kunne skrives inline. Forresten vil rammen mellem cellerne da være 2px, mens den vil være 3px udenpå tabellen med din løsning der?

Synes godt om

mclemens Nybegynder

27. maj 2006 - 19:53 #4

Tilføjet det davidfossil nævner ;)

#mitTable {border-collapse:collapse;
border:2px solid #000000;
}
#mitTable td{
border: 1px solid #000000;
}

Synes godt om

apo Praktikant

27. maj 2006 - 20:04 #5

netro > Hos mig ( i IE og FF) ser mit CSS-eksempel ud, præcis som den HTML-kode, du viste. Jeg overførte blot HTML-koden til min editor, og efterlignede den med CSS :-)

Hos mig er den ydre ramme 2px og den indre ramme 1px.

Kan du linke til et eksempel, der viser hvordan du gerne vil have det til at se ud?

Synes godt om

mclemens Nybegynder

27. maj 2006 - 20:14 #6

apo prøv at kaste cellspacing="0" på... tror måske det er fordi der ikke skal være margin mellem elementerne ... og når margin fjernes så giver din 3 px og 2 px

eksempel på 3 tabeller...

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"

"http://www.w3.org/TR/html4/loose.dtd"><html><head><meta http-equiv="content-type"

content="text/html; charset=iso-8859-1"><title>Ingen titel</title>

<style type="text/css">
#mitTable {
border:2px solid #000000;
}
#mitTable td{
border: 1px solid #000000;
}

#mitTable2 {border-collapse:collapse;
border:2px solid #000000;
}
#mitTable2 td{
border: 1px solid #000000;
}
</style>
</head>

<body>

<table id="mitTable">
<tr>
<td>ttt</td>
<td>ttt</td>
</tr>
<tr>
<td>ttt</td>
<td>ttt</td>
</tr>
</table>

<br><br>

<table id="mitTable" cellspacing="0">
<tr>
<td>ttt</td>
<td>ttt</td>
</tr>
<tr>
<td>ttt</td>
<td>ttt</td>
</tr>
</table>

<br><br>

<table id="mitTable2">
<tr>
<td>ttt</td>
<td>ttt</td>
</tr>
<tr>
<td>ttt</td>
<td>ttt</td>
</tr>
</table>

</body></html>

Synes godt om

netro Nybegynder

27. maj 2006 - 20:16 #7

Jo, det er for så vidt også fint, men hvis du sætter cellspacing til 0, så bliver alle rammer 1px bredere. Det kan nu løses ved at sætte collapse, men så bliver en del af rammen omkring cellerne fjernet.

Jeg kan egentlig sige det meget kort. Jeg vil gerne - uden brug af "border" og "bordercolor" kunne få præcis det samme som følgende eksempel - og helst skrevet inline i tags'ne.

<html>
<head>
</head>
<body>
<table cellspacing="2" border="1" bordercolor="#000000">
<tr>
<td>ttt</td>
<td>ttt</td>
</tr>
<tr>
<td>ttt</td>
<td>ttt</td>
</tr>
</table>
</body>
</html>

Synes godt om

mclemens Nybegynder

27. maj 2006 - 20:16 #8

[ Hos mig ( i IE og FF) ser mit CSS-eksempel ud, præcis som den HTML-kode, du viste. ] - Hov den havde jeg ikke set ... det gør den da også ;)

Synes godt om

netro Nybegynder

27. maj 2006 - 20:19 #9

Ja, det gør den. Jeg glemte at oplyse i spørgsmålet, at det gerne skulle fungere både med og uden cellspacing.

Synes godt om

mclemens Nybegynder

27. maj 2006 - 20:47 #10

[ at det gerne skulle fungere både med og uden cellspacing. ]
- Ikke helt forstået? Ved at skifte rundt på en attribut påvirker du jo tabellen, hvis din attribut tildeling ikke fungerer optimalt - kan du vel bruge css border-collapse:collapse; istedet for cellspacing="0" ... eller det var måske ikke det skifte resultat du mente?

Hvis du har apo's løsning 27/05-2006 19:25:00 ( med 1 px på tabel border ) via css så kan du overføre det til hans tabel eksempel i inline css sådan her:

<table style="border:1px solid #000000;">
<tr>
<td style="border: 1px solid #000000;">ttt</td>
<td style="border: 1px solid #000000;">ttt</td>
</tr>
<tr>
<td style="border: 1px solid #000000;">ttt</td>
<td style="border: 1px solid #000000;">ttt</td>
</tr>
</table>

Synes godt om

netro Nybegynder

27. maj 2006 - 20:54 #11

Det kan godt være, det er lidt for mange krav. Men ved nærmere eftertanke er det faktisk ikke så vigtigt med cellspacing. Så løsningen med border-collapse i table-tagget og border i td-taggene er vist fint.

Synes godt om

mclemens Nybegynder

27. maj 2006 - 21:15 #12

[ Det kan godt være, det er lidt for mange krav. ] - Slet ikke, det kan bare ikke fungere på den nævnte måde (hvis det var ønsket) da cellspacing="2" vs. cellspacing="0" ikke fungerer sådan...

[ Så løsningen med border-collapse i table-tagget og border i td-taggene er vist fint. ] - Super, så skal du vurdere hvem du skal give point til ... jeg er ikke interesseret i point, da jeg kun har svejset kodestumper sammen der var postet i tråden og givet minimal input. :)

Synes godt om

netro Nybegynder

28. maj 2006 - 20:43 #13

Okay ja. Så får apo hele dynen ;o)

Synes godt om

apo Praktikant

28. maj 2006 - 21:25 #14

Så kommer der et svar her :-)

Synes godt om

apo Praktikant

28. maj 2006 - 21:59 #15

Tak for points :-)

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