Toon posts:

[CSS] Table in DIV niet gestyled

Pagina: 1
Acties:

Onderwerpen

Css

dinsdag 20 september 2011 16:48

Acties:
  • 0 Henk 'm!
  • Artz
  • Registratie: Mei 2001
  • Laatst online: 06-09 19:43

Artz

Topicstarter
Sinds kort ben ik bezig mijn eeuwenoude frames website om te bouwen naar een hedendaagse site mbv css, divs en zelfs een beetje php. Aangezien ik geen meesterprogrammeur ben ontgaat me hier denk ik totaal iets.
Het probleem is het volgende: Ik heb veel data die ik in een table wil laten zien. Ik heb de table in een losse pagina gebouwd. Zag er allemaal prima uit, echter na knippen en plakken in de uiteindelijke pagina (een standaard opmaak met container -> header / content / footer) luistert de table niet meer naar de css. Ik krijg het met geen mogelijkheid aan de praat. Het zal zoals altijd met css wel aan een teken of spatie liggen maar ik zie het niet meer helder.

Losse css + pagina
HTML:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30

#test {
    width: 800px;
    height: 600px;
    margin: auto;
    background: #000;
}

.koepeloverzicht {
    margin-left: 50px;
    font-family: verdana, arial;
    font-size: 12px;
    background-color: #666;
    border-collapse: collapse;
    }

.koepeloverzicht th, .koepeloverzicht td {
    padding: 0.5em;
    border: 1px dotted #FFF;
}

.koepeloverzicht tr:hover {
    background-color: #999;
    color: #000;
}

.noot {
    font-size:70%;
    vertical-align: super;
    color: #FFFF00;
    }



HTML:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=9" />
<title>XXXX</title>


<link href="css/table-bunkersite.css" rel="stylesheet" type="text/css" />

</head>
<body>
<div id="test">
<table class="koepeloverzicht">
  <tr>
    <th>Place</td>
    <th>Specific</td>
    <th>Bunker</td>
    <th>Type</td>
    <th>M nr</td>
    <th>C nr</td>
    <th>Ordernr</td>
    <th>Year</td>
    <th>Firm</td>
  </tr>
  <tr>
    <td>Bledzew Pl</td>
    <td>Stary Dworek</td>
    <td>PzW. 867</td>
    <td>2P7 <p class="noot">1)</p></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
  </tr>
  <tr>
    <td>Oder-Warthe-Bogen Pl</td>
    <td>Oder-Warthe-Bogen</td>
    <td>PzW. 598</td>
    <td>2P7</td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
  </tr>
  <tr>
    <td>Bergen N</td>
    <td>MKB Fjell</td>
    <td>632</td>
    <td>3P7</td>
    <td></td>
    <td>19</td>
    <td></td>
    <td>1937</td>
    <td>BVG</td>
  </tr>
    <tr>
    <td>Esbjerg Dk</td>
    <td>Stp. Spangsberg</td>
    <td>632</td>
    <td>3P7</td>
    <td></td>
    <td>26</td>
    <td></td>
    <td>1937</td>
    <td>BVG</td>
  </tr>
    <tr>
    <td>Dieppe Fr</td>
    <td>Mont Robin, east</td>
    <td>632</td>
    <td>3P7</td>
    <td></td>
    <td>1190BW7642</td>
    <td></td>
    <td></td>
    <td></td>
  </tr>
</table>    

</div>
</body>
</html>


En in de uiteindelijke pagina:
HTML:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

<link href="css/stylesheet-bunkersite.css" rel="stylesheet" type="text/css" />

</head>
<body>
<div class="container">

    <div class="top">
        <div class="top-logo"></div>
        <div class="top-contact">
        
        </div>
        </div>
    <div class="menu">
        <div class="top-menu">
        
    
  <ul id="nav"> 
XXXXX
  </ul>

        </div>
   </div>

<div id="inhoudalgemeen">

<table class="koepeloverzicht">
  <tr>
    <th>Place</td>
    <th>Specific</td>
    <th>Bunker</td>
    <th>Type</td>
    <th>M nr</td>
    <th>C nr</td>
    <th>Ordernr</td>
    <th>Year</td>
    <th>Firm</td>
  </tr>
  <tr>
    <td>Bledzew Pl</td>
    <td>Stary Dworek</td>
    <td>PzW. 867</td>
    <td>2P7 <p class="noot">1)</p></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
  </tr>
  <tr>
    <td>Oder-Warthe-Bogen Pl</td>
    <td>Oder-Warthe-Bogen</td>
    <td>PzW. 598</td>
    <td>2P7</td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
  </tr>
  <tr>
    <td>Bergen N</td>
    <td>MKB Fjell</td>
    <td>632</td>
    <td>3P7</td>
    <td></td>
    <td>19</td>
    <td></td>
    <td>1937</td>
    <td>BVG</td>
  </tr>
  <tr>
    <td>Esbjerg Dk</td>
    <td>Stp. Spangsberg</td>
    <td>632</td>
    <td>3P7</td>
    <td></td>
    <td>26</td>
    <td></td>
    <td>1937</td>
    <td>BVG</td>
  </tr>
  <tr>
    <td>Dieppe Fr</td>
    <td>Mont Robin, east</td>
    <td>632</td>
    <td>3P7</td>
    <td></td>
    <td>1190BW7642</td>
    <td></td>
    <td></td>
    <td></td>
  </tr>
</table>    

</div>
    
    <div class="footer">div>
</div>
</body>
</html>

dinsdag 20 september 2011 16:54

Acties:
  • 0 Henk 'm!
  • Naranya
  • Registratie: Oktober 2010
  • Laatst online: 08:11

Naranya

Ik zie het probleem niet precies, ik zie gewoon een grijze tabel.
Wat verwacht je precies, en wat gaat er fout en in welke browser?

dinsdag 20 september 2011 16:59

Acties:
  • 0 Henk 'm!
  • OkkE
  • Registratie: Oktober 2000
  • Laatst online: 04-09 08:16

OkkE

CSS influencer :+

Even een kanttekening: Ik raad aan een ander DOCTYPE te gebruken. Deze <!DOCTYPE HTML> (HTML5) of anders de Strict variant van HTML4.

[ Voor 3% gewijzigd door OkkE op 20-09-2011 17:01 ]

“The best way to get the right answer on the Internet is not to ask a question, it's to post the wrong answer.”
QA Engineer walks into a bar. Orders a beer. Orders 0 beers. Orders 999999999 beers. Orders a lizard. Orders -1 beers.

dinsdag 20 september 2011 17:00

Acties:
  • 0 Henk 'm!
  • Beatboxx
  • Registratie: April 2010
  • Laatst online: 26-10-2022

Beatboxx

Certified n00b

Wat is nu precies het probleem? Bij mij werkt 't gewoon...

@hierboven +1

dinsdag 20 september 2011 17:01

Acties:
  • 0 Henk 'm!
  • Artz
  • Registratie: Mei 2001
  • Laatst online: 06-09 19:43

Artz

Topicstarter
Ow shit, zou het dan aan mijn Internet Explorer 7 liggen?
Het is een donkergrijze tabel met een hover effect per rij, licht grijs.

[ Voor 39% gewijzigd door Artz op 20-09-2011 17:01 ]

dinsdag 20 september 2011 17:02

Acties:
  • 0 Henk 'm!
  • Beatboxx
  • Registratie: April 2010
  • Laatst online: 26-10-2022

Beatboxx

Certified n00b

Probeer het eens met een ander zou ik zeggen

dinsdag 20 september 2011 17:10

Acties:
  • 0 Henk 'm!
  • Artz
  • Registratie: Mei 2001
  • Laatst online: 06-09 19:43

Artz

Topicstarter
Mobiel op Android werkt de Table ook niet in uiteidelijke DIV.

dinsdag 20 september 2011 17:53

Acties:
  • 0 Henk 'm!
  • Ram0n
  • Registratie: Maart 2002
  • Laatst online: 03-07 13:05

Ram0n

Bierbrouwende nerd

Werken de ander zaken die je in dat externe css-bestand bepaalt wel? Heb je het ergens online staan?

Eigenaar/brouwer Milky Road Brewery

dinsdag 20 september 2011 18:11

Acties:
  • 0 Henk 'm!
  • Artz
  • Registratie: Mei 2001
  • Laatst online: 06-09 19:43

Artz

Topicstarter
Alles werkt verder:

http://www.arthurvanbeveren.com/bunkers/tablesv1.html

http://www.arthurvanbeveren.com/bunkers/index2.html

dinsdag 20 september 2011 18:33

Acties:
  • 0 Henk 'm!
  • Ram0n
  • Registratie: Maart 2002
  • Laatst online: 03-07 13:05

Ram0n

Bierbrouwende nerd

Je sluit "#inhoudalgemeen h1" niet goed af, daar mist een }


Cascading Stylesheet:
1
2
3
4
5
6
7

#inhoudalgemeen h1 {
    font-size: 18px;
    font-weight: normal;    
    color: #000;
    padding-left: 25px;

/* MENU LINKS */


Tip voor de volgende keer: een validator kan dit snel aantonen :) Tools als Dragonfly en Firebug geven ook dit soort fouten aan.

[ Voor 92% gewijzigd door Ram0n op 20-09-2011 18:36 ]

Eigenaar/brouwer Milky Road Brewery

woensdag 21 september 2011 10:46

Acties:
  • 0 Henk 'm!
  • Artz
  • Registratie: Mei 2001
  • Laatst online: 06-09 19:43

Artz

Topicstarter
Ja normaal doe ik dat ook, maar ik was ervan overtuigd dat dit werkte ;)
Hij werkt nu inderdaad! Dank voor de reacties.

woensdag 21 september 2011 21:24

Acties:
  • 0 Henk 'm!
  • noes
  • Registratie: Augustus 2006
  • Niet online

noes

gek op benzine.

HTML:
1

    <div class="footer">div>


Over validatie gesproken, pak ook je HTML ff mee ;)

K54/R1250RS | K48/K1600GT | E61/550i

Pagina: 1
Reageer

Apple iPhone 16e LG OLED evo G5 Google Pixel 10 Samsung Galaxy S25 Star Wars: Outlaws Nintendo Switch 2 Apple AirPods Pro (2e generatie) Sony PlayStation 5 Pro

Tweakers is onderdeel van DPG Media B.V.
Alle rechten voorbehouden - Auteursrecht © 1998 - 2025 • Hosting door TrueFullstaq