Søg
Avatar billede mads375 Juniormester
12. maj 2008 - 17:22 Der er 11 kommentarer og
1 løsning

tabel struktur

Hejsa.

Jeg er lidt i tvivl om min tabelstruktur, jeg har rimelig mange tabeller, men skal gerne styre næsten hver enkel <tr> rimelig seperat fra de andre, da jeg gerne vil have placeret dem specielt.
Jeg kan desværre ikke finde ud af div tags.
Så spørgsmålet er:
Ser det ok fornuftig ud dette her:
Jeg ligger koden her:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
    <title>index</title>

    <link rel="stylesheet" type="text/css" href="css/tabeller.css" />
    <link rel="stylesheet" type="text/css" href="css/links.css" />
<meta name="Generator" content="Stone's WebWriter 4">
</head>
<body>
    <center>
        <table width="100">
        <table cellpadding"0" cellspacing="0" border="1">
            <tr>
                <td>1</td>
                <td>2</td>
                <td>3</td>
                <td>4</td>
                <td>5</td>
            </tr>
            </table>
            <table cellpadding="0" cellspacing="0" border="1">
                <tr>
                    <td>1</td>
                    <td>1</td>
                    <td>1</td>
                    <td>1</td>
                    <td>1</td>
                    <td>1</td>
                    <td>1</td>
                </tr>
            </table>
            <table cellpadding="0" cellspacing="0" border="1">
                <tr>
                    <td>1</td>
                    <td>2</td>
                </tr>
                <tr>
                    <td>2</td>
                    <td>2</td>
                </tr>
                <tr>
                    <td>3</td>
                    <td>2</td>
                </tr>
            </table>
            <table cellpadding="0" cellspacing="0" border="1">
                <tr>
                    <td>1</td>
                    <td>2</td>
                    <td>3</td>
                </tr>
            </table>
            <table cellpadding="0" cellspacing="0" border="1">
                <tr>
                    <td>1</td>
                    <td>2</td>
                </tr>
            </table>
            <table cellpadding="0" cellspacing="0" border="1">
                <tr>
                    <td>1</td>
                    <td>2</td>
                    <td>3</td>
                    <td>4</td>
                    <td>5</td>
                </tr>
            </table>
        </table>
    </center>
</body>
</html>

Med Venlig Hilsen
Mads
Avatar billede w13 Novice
12. maj 2008 - 17:26 #1
Det ser da rimeligt fornuftigt ud, ja.

Dog skal du være opmærksom på, at <center> er meget forældet. Prøv i stedet med:

<div style="margin:0 auto;text-align:center">
...
</div>

Derudover kan du spare alle:
  cellpadding="0" cellspacing="0"
hvis du i dit CSS-dokument skriver:
table{
  border-collapse:collapse
}

I øvrigt har du skrevet det sådan her på din første tabel:
  cellpadding"0" cellspacing="0"
Dvs. der mangler et "="-tegn.
Avatar billede w13 Novice
12. maj 2008 - 17:28 #2
Hov, du har jo også en <table width="100"> uden om alle andre tabeller, men den har ikke nogen tr'er og td'er? Det er meget ugyldigt at gøre det sådan.
Jeg ville helt fjerne den yderste <table> og så i stedet rette <center> til:

<div style="width:100px;margin:0 auto">

TABELLERNE HER

</div>
Avatar billede mads375 Juniormester
12. maj 2008 - 17:36 #3
tak for det hurtige svar.
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
    <title>index</title>

    <link rel="stylesheet" type="text/css" href="css/tabeller.css" />
    <link rel="stylesheet" type="text/css" href="css/links.css" />
<meta name="Generator" content="Stone's WebWriter 4">
</head>
<body>
    <div style="margin:0 auto;text-align:center">
        <table width="100">
            <table cellpadding="0" cellspacing="0" border="1">
                <tr>
                    <td>1</td>
                    <td>2</td>
                    <td>3</td>
                    <td>4</td>
                    <td>5</td>
                </tr>
                </table>
                <table cellpadding="0" cellspacing="0" border="1">
                    <tr>
                        <td>1</td>
                        <td>1</td>
                        <td>1</td>
                        <td>1</td>
                        <td>1</td>
                        <td>1</td>
                        <td>1</td>
                    </tr>
                </table>
                <table cellpadding="0" cellspacing="0" border="1">
                    <tr>
                        <td>1</td>
                        <td>2</td>
                    </tr>
                    <tr>
                        <td>2</td>
                        <td>2</td>
                    </tr>
                    <tr>
                        <td>3</td>
                        <td>2</td>
                    </tr>
                </table>
                <table cellpadding="0" cellspacing="0" border="1">
                    <tr>
                        <td>1</td>
                        <td>2</td>
                        <td>3</td>
                    </tr>
                </table>
                <table cellpadding="0" cellspacing="0" border="1">
                    <tr>
                        <td>1</td>
                        <td>2</td>
                    </tr>
                </table>
                <table cellpadding="0" cellspacing="0" border="1">
                    <tr>
                        <td>1</td>
                        <td>2</td>
                        <td>3</td>
                        <td>4</td>
                        <td>5</td>
                    </tr>
                </table>
            </table>
        </div>
</body>
</html>

Er det bedre nu?

Hvis jeg vil lave det i css, skal jeg så f.eks skrive:

<table class="w13">?
Avatar billede w13 Novice
12. maj 2008 - 17:39 #4
Med mit sidste svar bliver koden:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
    <title>index</title>

    <link rel="stylesheet" type="text/css" href="css/tabeller.css" />
    <link rel="stylesheet" type="text/css" href="css/links.css" />
    <meta name="Generator" content="Stone's WebWriter 4">
</head>
<body>
    <div style="width:100px;margin:0 auto">
            <table border="1">
                <tr>
                    <td>1</td>
                    <td>2</td>
                    <td>3</td>
                    <td>4</td>
                    <td>5</td>
                </tr>
                </table>
                <table border="1">
                    <tr>
                        <td>1</td>
                        <td>1</td>
                        <td>1</td>
                        <td>1</td>
                        <td>1</td>
                        <td>1</td>
                        <td>1</td>
                    </tr>
                </table>
                <table border="1">
                    <tr>
                        <td>1</td>
                        <td>2</td>
                    </tr>
                    <tr>
                        <td>2</td>
                        <td>2</td>
                    </tr>
                    <tr>
                        <td>3</td>
                        <td>2</td>
                    </tr>
                </table>
                <table border="1">
                    <tr>
                        <td>1</td>
                        <td>2</td>
                        <td>3</td>
                    </tr>
                </table>
                <table border="1">
                    <tr>
                        <td>1</td>
                        <td>2</td>
                    </tr>
                </table>
                <table border="1">
                    <tr>
                        <td>1</td>
                        <td>2</td>
                        <td>3</td>
                        <td>4</td>
                        <td>5</td>
                    </tr>
                </table>
        </div>
</body>
</html>

Og nej, du behøver vist ingen klasse.

Bare skriv:

table{
  border-collapse:collapse
}
Avatar billede mads375 Juniormester
12. maj 2008 - 17:44 #5
hvis jeg copy - paster din kode ryger mine tabeller til venstre.
Avatar billede mads375 Juniormester
12. maj 2008 - 17:45 #6
align: center":-)
Avatar billede w13 Novice
12. maj 2008 - 17:55 #7
Ja, det er rigtigt. Der skal lige en text-align:center; ind i stylen.

Så bliver de centreret, men stadig kun ude i højre side.
Havde glemt, at det ikke kunne gøres sådan med tabeller.

Du må sætte:
style="margin:0 auto"
på alle de tabeller, som skal midterstilles.
Du kan også bare sættes det ind i CSS'en:

table{
  border-collapse:collapse;
  margin:0 auto
}

Det kan også være, du vil lave en class til det, så det ikke bliver gjort på samtlige tabeller.
Avatar billede w13 Novice
12. maj 2008 - 17:55 #8
Så kan du også fjerne text-align:center
Avatar billede mads375 Juniormester
12. maj 2008 - 18:58 #9
hej igen:)
Jeg vil gerne have alle mine tabeller kommer til at stå i midten af skærmen, så det vil sige koden kommer til at se således ud:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
    <title>index</title>

    <link rel="stylesheet" type="text/css" href="css/tabeller.css" />
    <link rel="stylesheet" type="text/css" href="css/links.css" />
    <meta name="Generator" content="Stone's WebWriter 4">
</head>
<body>
   
            <table class="w13" border="1">
                <tr>
                    <td>1</td>
                    <td>2</td>
                    <td>3</td>
                    <td>4</td>
                    <td>5</td>
                </tr>
                </table>
                <table class="w13" border="1">
                    <tr>
                        <td>1</td>
                        <td>1</td>
                        <td>1</td>
                        <td>1</td>
                        <td>1</td>
                        <td>1</td>
                        <td>1</td>
                    </tr>
                </table>
                <table class="w13" border="1">
                    <tr>
                        <td>1</td>
                        <td>2</td>
                    </tr>
                    <tr>
                        <td>2</td>
                        <td>2</td>
                    </tr>
                    <tr>
                        <td>3</td>
                        <td>2</td>
                    </tr>
                </table>
                <table class="w13" border="1">
                    <tr>
                        <td>1</td>
                        <td>2</td>
                        <td>3</td>
                    </tr>
                </table>
                <table class="w13" border="1">
                    <tr>
                        <td>1</td>
                        <td>2</td>
                    </tr>
                </table>
                <table class="w13" border="1">
                    <tr>
                        <td>1</td>
                        <td>2</td>
                        <td>3</td>
                        <td>4</td>
                        <td>5</td>
                    </tr>
                </table>
       
</body>
</html>

<!------------------------------------css---------------------------------->

.w13      {
          border-collapse:collapse;
          margin:0 auto;
          }

Så bliver alle min tabeller centreret?

Jeg har slettet <div taget> så.
læg et svar også w13
Avatar billede w13 Novice
12. maj 2008 - 19:29 #10
Så skal du også lige lægge en width:noget; på - ellers skal du beholde div-tag'et og give det en bredde. Så holder tabellerne sig til den bredde.

Her er et svar. :)
Avatar billede olebole Juniormester
14. maj 2008 - 01:18 #11
<ole>

- og husk lige en fuld DTD:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
            "http://www.w3.org/TR/html4/loose.dtd">

/mvh
</bole>
Avatar billede w13 Novice
03. oktober 2008 - 14:13 #12
Tak for points! :)
Avatar billede 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.

Loading billede Opret Preview
Kategori
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.

Opret Log ind

Du kan også logge ind via nedenstående tjenester

Alle kategorier på Eksperten
Seneste spørgsmål Seneste aktivitet
I dag 09:50 Mobilpay svindel Af nu_igen i Andre onlineløsninger
22/0120:51 Knap til ipad Af FinnLauridsen i Excel
21/0113:53 Icloud mail via Outlook Af lbc i E-mail programmer
21/0108:32 USB NØGLE gratis Af nu_igen i Andet hardware
20/0121:11 Hvordan får jeg reCAPTCHA på min hjemmeside? Af Strawberry i PHP
White papers
Flere white papers »