Even een topicje, ik blijf ruzie houden met mijn vector graphics die ik in tabellen gooi. Specifiek met eentje. Waarschijnlijk kijk ik gewoon over een dubbele declaratie van een bepaalde variabele heen, maar op dit moment zie ik niet waar.
Het gaat om onderstaande snippet, alle javascript heb ik er even uitgestript, dat heeft geen invloed op deze, ik heb het namelijk ook als ik alleen onderstaande snippet host:
In het eerste stukje (met 1, 2, ..., 7) heb ik plaatjes. Die staan lokaal en doen het. De blokjes eronder doen het ook, alleen blijf ik onder deze 7 items een groot wit vlak houden. Ik kan niet plaatsen waar die precies vandaan komt of waar die in de code zit. De overflow op de y as hiden is natuurlijk een oplossing, maar naar mijn idee symptoombestrijding. Immers, als ik de hoogtebeperking (die pas is voor een plaatje + vector) eruit gooi dan zakt de "bedieningstand" naar beneden door het lege gedeelte. Zie onderstaande plaatje voor wat ik bedoel met loze ruimte.
En ja, je pagina indelen met tabellen is heel erg 2000, maar het volstaat voor deze toepassing (en nog steeds, net als in mijn andere topics hier, is de host een Raspberry Pi en is het zooitje niet extern benaderbaar, dus hoe lager de belasting van de server, hoe beter. En daarbij is het beeldscherm ook nog een klein dingetje.
Het gaat om onderstaande snippet, alle javascript heb ik er even uitgestript, dat heeft geen invloed op deze, ik heb het namelijk ook als ik alleen onderstaande snippet host:
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
| <?xml version="1.0" encoding="UTF-8" standalone="no"?> <html> <head> <title></title> </head> <body> <table border="0" cellpadding="1" cellspacing="0" height="115" width="600px"> <tbody> <tr> <td colspan="2"> <div style="width:600px; overflow-x: auto; overflow-y: hidden;"> <table border="0" cellpadding="0" cellspacing="0" > <tbody> <tr> <td> <img src="fileimages/1.png" height="125" width="110" /> <svg width="110"> <rect fill="red" height="40" r="40" stroke="black" stroke-width="2" width="110"></rect> <text fill="white" x="5" y="25">1</text> </svg></td> <td> <img src="fileimages/2.png" height="125" width="110" /> <svg width="110"> <rect fill="red" height="40" r="40" stroke="black" stroke-width="2" width="110"></rect> <text fill="white" x="5" y="25">2</text> </svg></td> <td> <img src="fileimages/3.png" height="125" width="110" /> <svg width="110"> <rect fill="red" height="40" r="40" stroke="black" stroke-width="2" width="110"></rect> <text fill="white" x="5" y="25">3</text> </svg></td> <td> <img src="fileimages/4.png" height="125" width="110" /> <svg width="110"> <rect fill="red" height="40" r="40" stroke="black" stroke-width="2" width="110"></rect> <text fill="white" x="5" y="25">4</text> </svg></td> <td> <img src="fileimages/5.png" height="125" width="110" /> <svg width="110"> <rect fill="red" height="40" r="40" stroke="black" stroke-width="2" width="110"></rect> <text fill="white" x="5" y="25">5</text> </svg></td> <td> <img src="fileimages/6.png" height="125" width="110" /> <svg width="110"> <rect fill="red" height="40" r="40" stroke="black" stroke-width="2" width="110"></rect> <text fill="white" x="5" y="25">6</text> </svg></td> <td> <img src="fileimages/7.png" height="125" width="110" /> <svg width="110"> <rect fill="red" height="40" r="40" stroke="black" stroke-width="2" width="110"></rect> <text fill="white" x="5" y="25">7</text> </svg></td> </tr> </tbody> </table> </div> </td> </tr> <tr> <td> <table border="0" cellpadding="0" cellspacing="0" width="200"> <tbody> <tr> <td colspan="2"><svg height="30" width="200"> <rect fill="black" height="30" r="40" stroke="black" stroke-width="3" width="200"></rect> <text fill="white" font-size="19" font-weight="bold" text-anchor="middle" x="100" y="21">Bedieningstand</text> </svg></td> </tr> <tr> <td colspan="2"><svg height="40" width="200"> <rect fill="red" height="40" r="40" stroke="black" stroke-width="3" width="200"></rect> <text fill="white" font-size="18" text-anchor="middle" x="100" y="27">Automatisch</text> </svg></td> </tr> <tr> <td colspan="2"><svg height="40" width="200"> <rect fill="red" height="40" r="40" stroke="black" stroke-width="3" width="200"></rect> <text fill="white" font-size="18" text-anchor="middle" x="100" y="27">Handmatig</text></svg></td> </tr> <tr> <td><svg height="40" width="100"> <rect fill="red" height="40" r="40" stroke="black" stroke-width="5" width="100"></rect> <text fill="white" font-size="18" text-anchor="middle" x="50" y="25">In</text></svg></td> <td><svg height="40" width="100"> <rect fill="red" height="40" r="40" stroke="black" stroke-width="5" width="100"></rect> <text fill="white" font-size="18" text-anchor="middle" x="50" y="25">Uit</text></svg></td> </tr> </tbody> </table> </td> <td style="width: 100px;"> </td> </tr> </tbody> </table> </body> </html> |
In het eerste stukje (met 1, 2, ..., 7) heb ik plaatjes. Die staan lokaal en doen het. De blokjes eronder doen het ook, alleen blijf ik onder deze 7 items een groot wit vlak houden. Ik kan niet plaatsen waar die precies vandaan komt of waar die in de code zit. De overflow op de y as hiden is natuurlijk een oplossing, maar naar mijn idee symptoombestrijding. Immers, als ik de hoogtebeperking (die pas is voor een plaatje + vector) eruit gooi dan zakt de "bedieningstand" naar beneden door het lege gedeelte. Zie onderstaande plaatje voor wat ik bedoel met loze ruimte.
En ja, je pagina indelen met tabellen is heel erg 2000, maar het volstaat voor deze toepassing (en nog steeds, net als in mijn andere topics hier, is de host een Raspberry Pi en is het zooitje niet extern benaderbaar, dus hoe lager de belasting van de server, hoe beter. En daarbij is het beeldscherm ook nog een klein dingetje.
/u/157297/crop5cee9488144ba_cropped.png?f=community)
