Tabellen Frage

02.08.2017 13:35
avatar  Dinah
#1 Tabellen Frage
avatar
Mitglied

Hallo meine Lieben,

ich hätte eine Frage bezüglich Tabellen in Themen und ich hoffe jemand kann mir diesbezüglich weiterhelfen.

Momentan habe ich meinen Code, so das ich die Tabelle in zwei teile unterstecke. Siehe *hier*

Jetzt hätte ich es jedoch gerne, das ich vier spalten nebeneinander habe in dennen jeweils eine Scrollbar ist. So das es nicht endlos lang wird sondern sich in der jeweiligen Spalte jeweils scrollen lässt.

Momentan sieht mein Code wie folgt aus:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
 

<table width="580px" height="200px" cellspacing="1" align="center" style="padding:10px; background:##9aa0ad;">
<tr style="color:#000000;vertical-align:bottom">
<td align="center" colspan="2"><strong> [style=font-size:15pt]Marvel Universe[/style]</strong></td>
</tr>
<tr height="25px">
<td width="200" align="center" bgcolor="#ab948a" style="padding-right:2px;"><strong>Avatar</strong></td>
<td width="200" align="center" bgcolor="#ab948a"><strong>Charakter</strong></td>
</tr>
<tr style="color:#8b8a8a">
<td>*
*
</td>
<td>*
*
*
</td>
</tr>
<tr>
<td height="30px"></td>
</tr>
</table>
 



Vielleicht weiss ja jemand weiter in diesem belangen :)


 Antworten

 Beitrag melden
02.08.2017 23:12 (zuletzt bearbeitet: 02.08.2017 23:17)
avatar  Olaf
#2 RE: Tabellen Frage
Ol
Mitglied

In einer normalen Tabelle lässt sich nichts scrollen.Die Tabellenzelle passt sich den übergroßen Inhalt an.
Man kann es mit Div machen,weil sich der übergroße Inhalt darin scrollen lässt.
Ich habe den Kopf in einer Tabelle gelassen und nur den Scrollbereich in Div gesetzt:

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
 
<center>
<table width="800px" cellspacing="1" style="padding:10px; background:#E2E2E2;">
<tr style="color:#000000;vertical-align:bottom;font-size:15pt;">
<th colspan="2">Marvel Universe</th>
<th colspan="2">D.C Universe</th>
</tr>
<tr>
<td align="center" colspan="4"></td>
</tr>
<tr height="25px">
<td style="width:25%; background:#ab948a; text-align:center;"><strong>Avatar</strong></td>
<td style="width:25%; background:#ab948a; text-align:center;"><strong>Charakter</strong></td>
<td style="width:25%; background:#ab948a; text-align:center;"><strong>Avatar</strong></td>
<td style="width:25%; background:#ab948a; text-align:center;"><strong>Charakter</strong></td>
</tr>
</table>
<div style="height: 200px; width: 800px; background:#E2E2E2; color:#8b8a8a;">
<div style="height: 200px; width: 25%; overflow: auto;float:left;">
* Chloe Bennet
</div>
<div style="height: 200px; width: 25%; overflow: auto;float:left;">
* Agent Skye
</div>
<div style="height: 200px; width: 25%; overflow: auto;float:left;">
* Anne Hathaway
</div>
<div style="height: 200px; width: 25%; overflow: auto;">
* Selina Kyle | Catwoman
</div>
</div>
</center>
 
 



Ich nehme an,das Du das ganze noch mehr verbreitern mußt,denn zu der Schrift kommen jetzt noch bei Übergröße die Scrollbalke dazu.Das mußt Du testen und dementsprechend ändern.

Gruß
Olaf

__________________________

http://138600.homepagemodules.de/

 Antworten

 Beitrag melden
03.09.2017 02:04
avatar  Dinah
#3 RE: Tabellen Frage
avatar
Mitglied

Ich glaube ich muss dich noch mal um Hilfe bitten @Olaf :x *du master of coding*

vielleicht liegt es auch einfach nur an der schweren Uhrzeit, das ich den Wald vor lauter Bäumen nicht mehr sehe, jedoch kommt bei mir immer folgendes raus *click mich*

Was auch hier zu sehen wäre.

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
 
<center>
<table width="800px" cellspacing="1" style="padding:10px; background:#f5f0e8;">
<tr style="color:#000000;vertical-align:bottom;font-size:15pt;">
</tr>
<tr>
<td align="center" colspan="4"></td>
</tr>
<tr height="25px">
<td style="width:25%; background:#7a4b58; text-align:center;"><strong>Avatar</strong></td>
<td style="width:25%; background:#7a4b58; text-align:center;"><strong>Charakter</strong></td>
<td style="width:25%; background:#7a4b58; text-align:center;"><strong>Avatar</strong></td>
<td style="width:25%; background:#7a4b58; text-align:center;"><strong>Charakter</strong></td>
</tr>
</table>
<div style="height: 200px; width: 800px; background:#f5f0e8; color:#8b8a8a;">
<div style="height: 200px; width: 25%; overflow: auto;float:left;">
*
*
*
*
*
*
*
*
*
</div>
<div style="height: 200px; width: 25%; overflow: auto;float:left;">
*
*
*
*
*
*
*
*
*
</div>
<div style="height: 200px; width: 25%; overflow: auto;float:left;">
*
*
*
*
*
*
*
*
*
</div>
<div style="height: 200px; width: 25%; overflow: auto;">
*
*
*
*
*
*
*
*
*
</div>
</div>
</center>


 


 Antworten

 Beitrag melden
04.09.2017 21:08 (zuletzt bearbeitet: 04.09.2017 21:09)
avatar  Olaf
#4 RE: Tabellen Frage
Ol
Mitglied

Da kann ich erstmal nichts zu sagen.
Vielleicht kann ein Techiniker was dazu sagen,das beim einsetzen von HTML Code im Posting alles verschoben angezeigt wird.
Im normalen Browserfenster wird beim gleichen HTML Code alles normal angezeigt.

Gruß
Olaf

__________________________

http://138600.homepagemodules.de/

 Antworten

 Beitrag melden
04.09.2017 21:24
avatar  Olaf
#5 RE: Tabellen Frage
Ol
Mitglied

Ich habe eben in Deinem Forum gesehen,das Du den Code nicht richtig aufgebaut hast.Da ist vor und nach jeder div Box immer ein "<br>" zuviel eingegeben worden und daher sind die Verschiebungen nach unten der einzelnen div Boxen.
Kannst Du mir den Code von Deiner Tabelle mal geben,dann korrigiere ich den.

Gruß
Olaf

__________________________

http://138600.homepagemodules.de/

 Antworten

 Beitrag melden
05.09.2017 10:40
avatar  Ingmar
#6 RE: Tabellen Frage
avatar
Technik

Genau - einfach mal alle <br> entfernen und Abstände statt dessen mit padding / margin per CSS einfügen. Dann klappt das auch

Viele Grüße,
Ingmar


 Technik · Homepagemodules.de · Miranus GmbH

 Antworten

 Beitrag melden
05.09.2017 16:20 (zuletzt bearbeitet: 05.09.2017 16:23)
avatar  Dinah
#7 RE: Tabellen Frage
avatar
Mitglied

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
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
 
<center>
<table width="800px" cellspacing="1" style="padding:10px; background:#f5f0e8;">
<tr style="color:#000000;vertical-align:bottom;font-size:15pt;">
</tr>
<tr>
<td align="center" colspan="4"></td>
</tr>
<tr height="25px">
<td style="width:25%; background:#7a4b58; text-align:center;"><strong>Avatar</strong></td>
<td style="width:25%; background:#7a4b58; text-align:center;"><strong>Vorname</strong></td>
<td style="width:25%; background:#7a4b58; text-align:center;"><strong>Nachnamen</strong></td>
<td style="width:25%; background:#7a4b58; text-align:center;"><strong>Reservierte Avatare</strong></td>
</tr>
</table>
<div style="height: 200px; width: 800px; background:#f5f0e8; color:#8b8a8a;">
<div style="height: 200px; width: 25%; overflow: auto;float:left;">
[u][b]A • B • C • D[/b][/u]
 
Alberto Rosende
Brie Larson
David Gandy
***
 
[u][b]E • F • G • H[/b][/u]
 
Harry Shum Jr.
Holland Roden
***
 
[u][b]I • J • K • L[/b][/u]
 
Josefine Frida Pettersen
Julian "Faber" Pollina
Katherine Mcnamara
***
 
[b][u]M • N • O • P[/u][/b]
 
Madelaine Petsch
Nina Dobrev
***
 
[u][b]Q • R • S • T[/b][/u]
 
***
***
***
[u][b]U • V • W • X • Y • Z[/b][/u]
 
***
***
***
 
</div>
<div style="height: 200px; width: 25%; overflow: auto;float:left;">
[u][b]A • B • C • D[/b][/u]
 
Annice Norabel Mercy
***
***
 
[u][b]E • F • G • H[/b][/u]
 
Harper
***
***
 
[u][b]I • J • K • L[/b][/u]
 
Linnea Circe
Linus
Kale
Kenneth
 
[b][u]M • N • O • P[/u][/b]
 
Michélle Francine
Naomi Elicia
***
 
[u][b]Q • R • S • T[/b][/u]
 
Rafael Luciano
Sasha
***
 
[u][b]U • V • W • X • Y • Z[/b][/u]
 
Vance
***
***
 
</div>
<div style="height: 200px; width: 25%; overflow: auto;float:left;">
[u][b]A • B • C • D[/b][/u]
 
Asberg
Delacroix
***
 
[u][b]E • F • G • H[/b][/u]
 
Hernández
Hoskins
***
***
 
[u][b]I • J • K • L[/b][/u]
 
Lherage
Kamake
***
 
[b][u]M • N • O • P[/u][/b]
 
Oswald
***
***
 
[u][b]Q • R • S • T[/b][/u]
 
***
***
***
[u][b]U • V • W • X • Y • Z[/b][/u]
 
Warren
***
***
 
</div>
<div style="height: 200px; width: 25%; overflow: auto;">
[u][b]A • B • C • D[/b][/u]
 
Danielle Campbell
Dominic Sherwood
***
***
 
[u][b]E • F • G • H[/b][/u]
 
***
***
***
 
[u][b]I • J • K • L[/b][/u]
 
***
***
***
 
[b][u]M • N • O • P[/u][/b]
 
Matthew Daddario
***
***
 
[u][b]Q • R • S • T[/b][/u]
 
Taron Egerton
***
***
[u][b]U • V • W • X • Y • Z[/b][/u]
 
***
***
***
 
</div>
</div>
</center>
 



Das ist er.

Vielen lieben Dank an Euch für eure klasse Hilfe!
Das mit dem Zeilenumbruch hats nun wieder alles sauber verbessert!


 Antworten

 Beitrag melden
Bereits Mitglied?
Jetzt anmelden!
Mitglied werden?
Jetzt registrieren!