Ik heb redelijk niet met CSS en HTML. De basis heb ik al onder de knie, en nu wil ik dus een website maken die compleet geen opmaakdata in de HTML files bevat. Ik heb dus een site gemaakt in Kompozer, die bevat een tabel. Hij heeft links en rechts een buitenrand zeg maar, dat is een cel, die is 20px breed, en die bevat een achtergrond, voor een schaduw-effect. Als ik dit gewoon in Kompozer doe, werkt het prima. Vervolgens zet ik alle opmaak die dan in de HTML staat netjes over naar een externe CSS file. Echt 1 op 1. Toch verspringt de schaduw-cell, om het zo te noemen, van 20px naar 18px in Kompozer. Als ik in de browser kijk, is hij zelfs breder als 20px, want de achtergrond begint rechts weer opnieuw. In mijn CSS staat duidelijk dat hij 20px moet zijn, de achtergrond is ook 20px. Ik heb de volgende dingen aan de CSS table toegevoegd:
Dat werkt ook niet. Ik snap echt niet hoe dit kan, maar als ik intern gewoon style gebruik, en dan 20px breedte definieer, dan werkt het wel. Is hier iets kleins wat ik over het hoofd zie?
Ps. Ik moet wel even er bij zeggen dat mijn tabel geen borders heeft (dus 0px), en collapsed etc. is, zodat het onzichtbaar is, Ik heb een vermoeden dat het hier mee te maken heeft, maar ik kom er absoluut niet uit. Ik heb op Google gezocht, ik kom niet op hits met dezelfde problemen als mij. Ook op Tweakers gezocht, ik heb een paar topics gevonden waarbij mensen ongeveer hetzelfde probleem hebben (maar net iets anders), de oplossingen die voor hen werken, werken voor mij dus niet, omdat mijn situatie een beetje anders is.
Alvast bedankt!
PSS.
Website: http://www.aoevillage.com/test.html
Mijn CSS file:
code:
1
2
| table-layout: fixed; overflow: hidden; |
Dat werkt ook niet. Ik snap echt niet hoe dit kan, maar als ik intern gewoon style gebruik, en dan 20px breedte definieer, dan werkt het wel. Is hier iets kleins wat ik over het hoofd zie?
Ps. Ik moet wel even er bij zeggen dat mijn tabel geen borders heeft (dus 0px), en collapsed etc. is, zodat het onzichtbaar is, Ik heb een vermoeden dat het hier mee te maken heeft, maar ik kom er absoluut niet uit. Ik heb op Google gezocht, ik kom niet op hits met dezelfde problemen als mij. Ook op Tweakers gezocht, ik heb een paar topics gevonden waarbij mensen ongeveer hetzelfde probleem hebben (maar net iets anders), de oplossingen die voor hen werken, werken voor mij dus niet, omdat mijn situatie een beetje anders is.
Alvast bedankt!
PSS.
Website: http://www.aoevillage.com/test.html
Mijn CSS file:
Cascading Stylesheet: style.css
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
| body { background-color: #e9e4d1; margin: 0px; } table { width: 1040px; text-align: left; margin-left: auto; margin-right: auto; border: 0px; padding: 0px; border-collapse: collapse; background-color: #cabc95; } #shadow10 { width: 20px; height: 150px; background-image: url("img/shadow1.jpg"); } #shadow20 { width: 20px; height: 150px; background-image: url("img/shadow2.jpg"); } #shadow11 { height: 20px; background-image: url("img/shadow1.jpg"); } .menutop { width: 200px; height: 20px; background-image: url("img/menu1.jpg"); } #shadow12 { height: 30px;" background-image: url("img/shadow1.jpg"); } #shadow13 { height: 120px; background-image: url("img/shadow1.jpg"); } |
[ Voor 20% gewijzigd door Verwijderd op 01-10-2010 22:33 . Reden: CSS bestand + website bijgevoegd ]