Top-Themen

AppleEntwicklungHardwareInternetLinuxMicrosoftMultimediaNetzwerkeOff TopicSicherheitSonstige SystemeVirtualisierungWeiterbildungZusammenarbeit

Aktuelle Themen

Administrator.de FeedbackApache ServerAppleAssemblerAudioAusbildungAuslandBackupBasicBatch & ShellBenchmarksBibliotheken & ToolkitsBlogsCloud-DiensteClusterCMSCPU, RAM, MainboardsCSSC und C++DatenbankenDatenschutzDebianDigitiales FernsehenDNSDrucker und ScannerDSL, VDSLE-BooksE-BusinessE-MailEntwicklungErkennung und -AbwehrExchange ServerFestplatten, SSD, RaidFirewallFlatratesGoogle AndroidGrafikGrafikkarten & MonitoreGroupwareHardwareHosting & HousingHTMLHumor (lol)Hyper-VIconsIDE & EditorenInformationsdiensteInstallationInstant MessagingInternetInternet DomäneniOSISDN & AnaloganschlüsseiTunesJavaJavaScriptKiXtartKVMLAN, WAN, WirelessLinuxLinux DesktopLinux NetzwerkLinux ToolsLinux UserverwaltungLizenzierungMac OS XMicrosoftMicrosoft OfficeMikroTik RouterOSMonitoringMultimediaMultimedia & ZubehörNetzwerkeNetzwerkgrundlagenNetzwerkmanagementNetzwerkprotokolleNotebook & ZubehörNovell NetwareOff TopicOpenOffice, LibreOfficeOutlook & MailPapierkorbPascal und DelphiPeripheriegerätePerlPHPPythonRechtliche FragenRedHat, CentOS, FedoraRouter & RoutingSambaSAN, NAS, DASSchriftartenSchulung & TrainingSEOServerServer-HardwareSicherheitSicherheits-ToolsSicherheitsgrundlagenSolarisSonstige SystemeSoziale NetzwerkeSpeicherkartenStudentenjobs & PraktikumSuche ProjektpartnerSuseSwitche und HubsTipps & TricksTK-Netze & GeräteUbuntuUMTS, EDGE & GPRSUtilitiesVB for ApplicationsVerschlüsselung & ZertifikateVideo & StreamingViren und TrojanerVirtualisierungVisual StudioVmwareVoice over IPWebbrowserWebentwicklungWeiterbildungWindows 7Windows 8Windows 10Windows InstallationWindows MobileWindows NetzwerkWindows ServerWindows SystemdateienWindows ToolsWindows UpdateWindows UserverwaltungWindows VistaWindows XPXenserverXMLZusammenarbeit
GELÖST

HTML Umfrageformular - Spaltenbreiten

Frage Entwicklung HTML

Mitglied: eXtremeTK

eXtremeTK (Level 1) - Jetzt verbinden

03.08.2010 um 11:46 Uhr, 3751 Aufrufe, 8 Kommentare

Verzeertes HTML Formular - Funktion jedoch einwandfrei

Hallo Zusammen.

Ich habe mir ein HTML Formular gebaut und dieses in mein CMS System eingepflegt.
Die Funktionen, Button etc. funktionieren einwandfrei.

Jedoch wird das Layout verzeert dargestellt. Mein Problem ist, dass im HTML Formular die verschiedenen "Radio"-Buttons unterschiedlich angezeigt werden.

Mein Problem ist nun, dass ich nirgends wirklich die breiten beeinflussen kann, bzw. es funktioniert nicht.
Hat jemand eine Idee, wie ich den Fehler beheben kann?

Gruß & DANKE!


01.
 
02.
<table cellspacing="0" cellpadding="0" border="0" style="padding: 10px; border: 1px solid #999999; width: 470px;"> 
03.
 <tr> 
04.
   <td colspan="4"><strong><center>Wie beurteilen Sie die Zeitung</center></strong></td> 
05.
   </tr> 
06.
 
07.
<!-- ANFANG von Optik / Gestaltung       --> 
08.
 
09.
 <tr> 
10.
  <td colspan="3"><strong>in der Optik / Gestaltung</strong></td> 
11.
  </tr> 
12.
<!-- Note 1 - sehr gut für Optik / Gestaltung --> 
13.
 
14.
 <tr style="width:10px;border-bottom: 1px dotted #999999;"> 
15.
   <td style="width:1px;border-bottom: 1px dotted #999999;"><p> 
16.
     <input type="radio" name="Optik" id="sehr gut" value="1" /> 
17.
   </p></td> 
18.
   <td style="width:40px;border-bottom: 1px dotted #999999;"><p>1</p></td> 
19.
 
20.
<!-- Note 2 - gut für Optik / Gestaltung         --> 
21.
 
22.
   <td style="width:10px;border-bottom: 1px dotted #999999;"><p> 
23.
     <input type="radio" name="Optik" id="gut" value="2" /> 
24.
   </p></td> 
25.
   <td style="width:40px;border-bottom: 1px dotted #999999;"><p>2</p></td> 
26.
 
27.
<!-- Note 3 - befriedigend für Optik / Gestaltung         --> 
28.
 
29.
   <td style="width:10px;border-bottom: 1px dotted #999999;"><p> 
30.
     <input type="radio" name="Optik" id="befriedigend" value="3" /> 
31.
   </p></td> 
32.
   <td style="width:40;border-bottom: 1px dotted #999999;"><p>3</p></td> 
33.
 
34.
<!-- Note 4 - ausreichend für Optik / Gestaltung         --> 
35.
 
36.
   <td style="width:10px;border-bottom: 1px dotted #999999;"><p> 
37.
     <input type="radio" name="Optik" id="ausreichend" value="4" /> 
38.
   </p></td> 
39.
   <td style="width:40px;border-bottom: 1px dotted #999999;"><p>4</p></td> 
40.
 
41.
<!-- Note 5 - mangelhaft für Optik / Gestaltung         --> 
42.
 
43.
   <td style="width:10px;border-bottom: 1px dotted #999999;"><p> 
44.
     <input type="radio" name="Optik" id="mangelhaft" value="5" /> 
45.
   </p></td> 
46.
   <td style="width:40px;border-bottom: 1px dotted #999999;"><p>5</p></td> 
47.
 
48.
<!-- Note 6 - ungenügend für Optik / Gestaltung         --> 
49.
 
50.
   <td style="width:10px;border-bottom: 1px dotted #999999;"><p> 
51.
     <input type="radio" name="Optik" id="ungenuegend" value="6" /> 
52.
   </p></td> 
53.
   <td style="width:40px;border-bottom: 1px dotted #999999;"><p>6</p></td> 
54.
 
55.
</tr> 
56.
 
57.
<!-- ENDE von Optik / Gestaltung       --> 
58.
 
59.
<!-- ANFANG von Inhalt       --> 
60.
 
61.
 <tr> 
62.
  <td colspan="3"><strong>vom Inhalt</strong></td> 
63.
  </tr> 
64.
<!-- Note 1 - sehr gut für Inhalt --> 
65.
 
66.
 <tr style="width:10px;border-bottom: 1px dotted #999999;"> 
67.
   <td style="width:1px;border-bottom: 1px dotted #999999;"><p> 
68.
     <input type="radio" name="Inhalt" id="sehr gut" value="1" /> 
69.
   </p></td> 
70.
   <td style="width:40px;border-bottom: 1px dotted #999999;"><p>1</p></td> 
71.
 
72.
<!-- Note 2 - gut für Inhalt         --> 
73.
 
74.
   <td style="width:10px;border-bottom: 1px dotted #999999;"><p> 
75.
     <input type="radio" name="Inhalt" id="gut" value="2" /> 
76.
   </p></td> 
77.
   <td style="width:40px;border-bottom: 1px dotted #999999;"><p>2</p></td> 
78.
 
79.
<!-- Note 3 - befriedigend für Inhalt         --> 
80.
 
81.
   <td style="width:10px;border-bottom: 1px dotted #999999;"><p> 
82.
     <input type="radio" name="Inhalt" id="befriedigend" value="3" /> 
83.
   </p></td> 
84.
   <td style="width:40px;border-bottom: 1px dotted #999999;"><p>3</p></td> 
85.
 
86.
<!-- Note 4 - ausreichend für Inhalt         --> 
87.
 
88.
   <td style="width:10px;border-bottom: 1px dotted #999999;"><p> 
89.
     <input type="radio" name="Inhalt" id="ausreichend" value="4" /> 
90.
   </p></td> 
91.
   <td style="width:40px;border-bottom: 1px dotted #999999;"><p>4</p></td> 
92.
 
93.
<!-- Note 5 - mangelhaft für Inhalt          --> 
94.
 
95.
   <td style="width:10px;border-bottom: 1px dotted #999999;"><p> 
96.
     <input type="radio" name="Inhalt" id="mangelhaft" value="5" /> 
97.
   </p></td> 
98.
   <td style="width:40px;border-bottom: 1px dotted #999999;"><p>5</p></td> 
99.
 
100.
<!-- Note 6 - ungenügend für Inhalt         --> 
101.
 
102.
   <td style="width:10px;border-bottom: 1px dotted #999999;"><p> 
103.
     <input type="radio" name="Inhalt" id="ungenuegend" value="6" /> 
104.
   </p></td> 
105.
   <td style="width:40px;border-bottom: 1px dotted #999999;"><p>6</p></td> 
106.
 
107.
</tr> 
108.
 
109.
<!-- ENDE von Inhalt       --> 
110.
 
111.
<!-- ANFANG von Aktualität      --> 
112.
 
113.
 <tr> 
114.
  <td colspan="3"><strong>von der Aktualit&auml;t</strong></td> 
115.
  </tr> 
116.
<!-- Note 1 - sehr gut für Aktualitaet --> 
117.
 
118.
 <tr style="width:10px;border-bottom: 1px dotted #999999;"> 
119.
   <td style="width:1px;border-bottom: 1px dotted #999999;"><p> 
120.
     <input type="radio" name="Aktualitaet" id="sehr gut" value="1" /> 
121.
   </p></td> 
122.
   <td style="width:40px;border-bottom: 1px dotted #999999;"><p>1</p></td> 
123.
 
124.
<!-- Note 2 - gut für Aktualitaet         --> 
125.
 
126.
   <td style="width:10px;border-bottom: 1px dotted #999999;"><p> 
127.
     <input type="radio" name="Aktualitaet" id="gut" value="2" /> 
128.
   </p></td> 
129.
   <td style="width:40px;border-bottom: 1px dotted #999999;"><p>2</p></td> 
130.
 
131.
<!-- Note 3 - befriedigend für Aktualitaet         --> 
132.
 
133.
   <td style="width:10px;border-bottom: 1px dotted #999999;"><p> 
134.
     <input type="radio" name="Aktualitaet" id="befriedigend" value="3" /> 
135.
   </p></td> 
136.
   <td style="width:40px;border-bottom: 1px dotted #999999;"><p>3</p></td> 
137.
 
138.
<!-- Note 4 - ausreichend für Aktualitaet         --> 
139.
 
140.
   <td style="width:10px;border-bottom: 1px dotted #999999;"><p> 
141.
     <input type="radio" name="Aktualitaet" id="ausreichend" value="4" /> 
142.
   </p></td> 
143.
   <td style="width:40px;border-bottom: 1px dotted #999999;"><p>4</p></td> 
144.
 
145.
<!-- Note 5 - mangelhaft für Aktualitaet          --> 
146.
 
147.
   <td style="width:10px;border-bottom: 1px dotted #999999;"><p> 
148.
     <input type="radio" name="Aktualitaet" id="mangelhaft" value="5" /> 
149.
   </p></td> 
150.
   <td style="width:40px;border-bottom: 1px dotted #999999;"><p>5</p></td> 
151.
 
152.
<!-- Note 6 - ungenügend für Aktualitaet         --> 
153.
 
154.
   <td style="width:10px;border-bottom: 1px dotted #999999;"><p> 
155.
     <input type="radio" name="Aktualitaet" id="ungenuegend" value="6" /> 
156.
   </p></td> 
157.
   <td style="width:40px;border-bottom: 1px dotted #999999;"><p>6</p></td> 
158.
 
159.
</tr> 
160.
 
161.
<!-- ENDE von Aktualitaet       --> 
162.
 
163.
 
164.
<!-- ANFANG von Umfang     --> 
165.
 
166.
 <tr> 
167.
  <td colspan="3"><strong>vom Umfang (16 Seiten)</strong></td> 
168.
  </tr> 
169.
 
170.
<!-- weniger - für Umfang --> 
171.
 
172.
 <tr style="width:10px;border-bottom: 1px dotted #999999;"> 
173.
   <td style="width:10px;border-bottom: 1px dotted #999999;"><p> 
174.
     <input type="radio" name="Umfang" id="weniger" value="weniger" /> 
175.
   </p></td> 
176.
   <td style="width:40px;border-bottom: 1px dotted #999999;"><p>weniger</p></td> 
177.
 
178.
<!-- ausreichend - für Umfang         --> 
179.
 
180.
   <td style="width:10px;border-bottom: 1px dotted #999999;"><p> 
181.
     <input type="radio" name="Umfang" id="ausreichend" value="ausreichend" /> 
182.
   </p></td> 
183.
   <td style="width:40px;border-bottom: 1px dotted #999999;"><p>ausreichend</p></td> 
184.
 
185.
<!-- mehr - für Umfang         --> 
186.
 
187.
   <td style="width:10px;border-bottom: 1px dotted #999999;"><p> 
188.
     <input type="radio" name="Umfang" id="mehr" value="mehr" /> 
189.
   </p></td> 
190.
   <td style="width:40px;border-bottom: 1px dotted #999999;"><p>mehr</p></td> 
191.
 
192.
 </tr> 
193.
<!-- ENDE vom Umfang       --> 
194.
 
195.
<!-- ANFANG von Erscheinungsintervall     --> 
196.
 
197.
 <tr> 
198.
  <td colspan="3"><strong>vom Erscheinungsintervall (4x im Jahr)</strong></td> 
199.
  </tr> 
200.
 
201.
<!-- weniger - für Erscheinungsintervall --> 
202.
 
203.
 <tr style="width:1px;border-bottom: 1px dotted #999999;"> 
204.
   <td style="width:1px;border-bottom: 1px dotted #999999;"><p> 
205.
     <input type="radio" name="Erscheinungsintervall" id="weniger" value="weniger" /> 
206.
   </p></td> 
207.
   <td style="width:150px;border-bottom: 1px dotted #999999;"><p>weniger</p></td> 
208.
 
209.
<!-- ausreichend -  für Erscheinungsintervall         --> 
210.
 
211.
   <td style="width:1px;border-bottom: 1px dotted #999999;"><p> 
212.
     <input type="radio" name="Erscheinungsintervall" id="ausreichend" value="ausreichend" /> 
213.
   </p></td> 
214.
   <td style="width:150px;border-bottom: 1px dotted #999999;"><p>ausreichend</p></td> 
215.
 
216.
<!-- mehr - für Erscheinungsintervall         --> 
217.
 
218.
   <td style="width:1px;border-bottom: 1px dotted #999999;"><p> 
219.
     <input type="radio" name="Erscheinungsintervall" id="mehr" value="mehr" /> 
220.
   </p></td> 
221.
   <td style="width:150px;border-bottom: 1px dotted #999999;"><p>mehr</p></td> 
222.
 
223.
</tr> 
224.
 
225.
<!-- ENDE vom Erscheinungsintervall       --> 
226.
 
227.
<!-- ANFANG von Art der Zusendung     --> 
228.
 
229.
 <tr> 
230.
  <td colspan="3"><strong>Wie m&ouml;chten Sie die Zeitung erhalten? </strong></td> 
231.
  </tr> 
232.
 
233.
<!-- Zusendung per Post nach Hause --> 
234.
 
235.
 <tr style="border-bottom: 10px dotted #999999;"> 
236.
   <td style="width:200px;border-bottom: 1px dotted #999999;"><p> 
237.
     <input type="radio" name="Zusendung" id="Post" value="Zusendung nach Hause" /> 
238.
   </p></td> 
239.
   <td style="width:300px;border-bottom: 1px dotted #999999;"><p>als Druck nach Hause</p></td> 
240.
 
241.
<!--  Einstellung ins Intranet       --> 
242.
 
243.
   <td style="width:200px;border-bottom: 1px dotted #999999;"><p> 
244.
     <input type="radio" name="Zusendung" id="Intranet" value="Einstellung ins Intranet" /> 
245.
   </p></td> 
246.
   <td style="width:300px;border-bottom: 1px dotted #999999;"><p>jeden Artikel tagesaktuell im Intranet</p></td> 
247.
 
248.
</tr> 
249.
 
250.
<!-- ENDE von Zusendung       --> 
251.
 
252.
 
253.
 <tr><td colspan="4"><p><strong>Anmerkungen, Anregungen, Vorschl&auml;ge: </strong></p></td></tr> 
254.
 <tr><td colspan="4"><textarea name="Anfrage" id="Anfrage" style="width:480px;height:140px;font-family:Verdana,Tahoma,Arial,Helvetica,Sans-serif,sans-serif;font-size:11px;"></textarea></td></tr> 
255.
 <tr> 
256.
   <td colspan="4"><strong>Vielen Dank f&uuml;r Ihre Meinung.</strong><br /> 
257.
   </td> 
258.
 </tr> 
259.
 <tr> 
260.
   <td colspan="4"><input type="submit" value="{ABSCHICKEN}"/></td> 
261.
   </tr> 
262.
 
263.
 
264.
</table> 
265.
 
Mitglied: Connor1980
03.08.2010 um 12:32 Uhr
Hallo,

durch unterschiedlich viel Text in den Spalten (z.B. "2" und "jeden Artikel tagesaktuell im Intranet") werden diese eben auch unterschiedlich breit. Z.B. entweder die Werte in unterschiedliche Spalten schreiben (Anzahl der Spalten erhöhen?), oder unterschiedliche Tabellen definieren.

Grüße
Bitte warten ..
Mitglied: mkuchen
03.08.2010 um 12:33 Uhr
Moin,

was passiert denn wenn du aus

<table cellspacing="0" cellpadding="0" border="0" style="padding: 10px; border: 1px solid #999999; width: 470px;">

einfach mal das "width: 470px" raus nimmst?

edit: vergiss meinen Beitrag .... ich hab mal wieder nicht richtig gelesen ....
Bitte warten ..
Mitglied: laster
03.08.2010 um 12:41 Uhr
Hallo eXtremeTK,

setze bei Deiner Tabelle mal border="1" und kläre die Spaltenanzahl (3, 4 oder doch 12). Sinn macht, in jeder Zeile die gleiche Anzahl von Spalten, die Radiobuttons inkl. Beschreibung in eine Spalte, ...
Mit bisschen HTML-Wissen sollte Dein Wunsch umsetzbar sein. Siehe http://de.selfhtml.org/html/tabellen/gestaltung.htm

vG
LS
Bitte warten ..
Mitglied: eXtremeTK
03.08.2010 um 13:11 Uhr
Danke schonmal für die Antworten!
Mal habe ich 4 mal aber auch 12 Spalten, je nachdem in welcher Zeile ich mich befinde.

Wenn ich es richtig verstehe, dann behalte ich eine Tabelle, packe aber nun jede Zeile mit <tr> </tr> in eine eigene Zelle, damit jede unabhängig von der anderen ist?
Ich habe zudem alle

border-bottom: 1px dotted #999999;

entfernt um ein bisschen Übersicht in meinen Code zu bekommen. Das kann ich später ja wieder einfügen.

Ich werde mich gleich daran machen, die mehreren Spalten aufzulösen :S
Bitte warten ..
Mitglied: Privateer3000
03.08.2010 um 13:38 Uhr
Hallo,
tu Dir selbst einen Gefallen und beende die Tabellenschubserei. Sie wird Dir immer Grenzen aufzeigen was die Gestaltung angeht.
Setz' auf's neue Pferd und gestalte mit CSS. Pack Deine Formularkompos in Container und lege das Layout fest.
Die Zeit sich 1 bis 2 Wochen damit auseinanderzusetzen wird sich schnell rentieren und wirst es nicht bereuen.
Egal ob man das nur mal so braucht oder intensiver damit arbeiten will. Es macht auch mehr Spass als mit sturen Tabellen.
Bitte warten ..
Mitglied: eXtremeTK
03.08.2010 um 13:56 Uhr
Mein Problem ist an der Sache, dass ich morgen fertig sein muss / soll.
Danach schaue ich mir auch das CSS nochmal genau an. Vorher muss ich jedoch damit noch arbeiten.

Es klappt aber nicht wirklich :S

So, ich habe nun schonmal es soweit, dass die Überschriften richtig angeordnet sind. Lediglich ein zwei Spalten werden noch falsch angezeigt:

01.
 
02.
<table cellspacing="0" cellpadding="0" border="1" style="padding: 10px; border: 1px solid #999999; width: 470px;"> 
03.
 <tr> 
04.
   <td colspan="12"><strong><center>Wie beurteilen Sie die Zeitung</center></strong></td> 
05.
   </tr> 
06.
 
07.
<!-- ANFANG von Optik / Gestaltung       --> 
08.
 
09.
 <tr> 
10.
  <td colspan="12"><strong>in der Optik / Gestaltung</strong></td> 
11.
  </tr> 
12.
<!-- Note 1 - sehr gut für Optik / Gestaltung --> 
13.
 
14.
 <tr> 
15.
   <td style="width:1px;"><p> 
16.
     <input type="radio" name="Optik" id="sehr gut" value="1" /> 
17.
   </p></td> 
18.
   <td style="width:1px;"><p>1</p></td> 
19.
 
20.
<!-- Note 2 - gut für Optik / Gestaltung         --> 
21.
 
22.
   <td style="width:1px;"><p> 
23.
     <input type="radio" name="Optik" id="gut" value="2" /> 
24.
   </p></td> 
25.
   <td style="width:1px;"><p>2</p></td> 
26.
 
27.
<!-- Note 3 - befriedigend für Optik / Gestaltung         --> 
28.
 
29.
   <td style="width:1px;"><p> 
30.
     <input type="radio" name="Optik" id="befriedigend" value="3" /> 
31.
   </p></td> 
32.
   <td style="width:1;"><p>3</p></td> 
33.
 
34.
<!-- Note 4 - ausreichend für Optik / Gestaltung         --> 
35.
 
36.
   <td style="width:1px;"><p> 
37.
     <input type="radio" name="Optik" id="ausreichend" value="4" /> 
38.
   </p></td> 
39.
   <td style="width:1px;"><p>4</p></td> 
40.
 
41.
<!-- Note 5 - mangelhaft für Optik / Gestaltung         --> 
42.
 
43.
   <td style="width:1px;"><p> 
44.
     <input type="radio" name="Optik" id="mangelhaft" value="5" /> 
45.
   </p></td> 
46.
   <td style="width:1px;"><p>5</p></td> 
47.
 
48.
<!-- Note 6 - ungenügend für Optik / Gestaltung         --> 
49.
 
50.
   <td style="width:1px;"><p> 
51.
     <input type="radio" name="Optik" id="ungenuegend" value="6" /> 
52.
   </p></td> 
53.
   <td style="width:1px;"><p>6</p></td> 
54.
 
55.
</tr> 
56.
 
57.
<!-- ENDE von Optik / Gestaltung       --> 
58.
 
59.
<!-- ANFANG von Inhalt       --> 
60.
 
61.
 <tr> 
62.
  <td colspan="12"><strong>vom Inhalt</strong></td> 
63.
  </tr> 
64.
<!-- Note 1 - sehr gut für Inhalt --> 
65.
 
66.
 <tr style="width:1px;"> 
67.
   <td style="width:1px;"><p> 
68.
     <input type="radio" name="Inhalt" id="sehr gut" value="1" /> 
69.
   </p></td> 
70.
   <td style="width:1px;"><p>1</p></td> 
71.
 
72.
<!-- Note 2 - gut für Inhalt         --> 
73.
 
74.
   <td style="width:10px;"><p> 
75.
     <input type="radio" name="Inhalt" id="gut" value="2" /> 
76.
   </p></td> 
77.
   <td style="width:1px;"><p>2</p></td> 
78.
 
79.
<!-- Note 3 - befriedigend für Inhalt         --> 
80.
 
81.
   <td style="width:10px;"><p> 
82.
     <input type="radio" name="Inhalt" id="befriedigend" value="3" /> 
83.
   </p></td> 
84.
   <td style="width:1px;"><p>3</p></td> 
85.
 
86.
<!-- Note 4 - ausreichend für Inhalt         --> 
87.
 
88.
   <td style="width:10px;"><p> 
89.
     <input type="radio" name="Inhalt" id="ausreichend" value="4" /> 
90.
   </p></td> 
91.
   <td style="width:1px;"><p>4</p></td> 
92.
 
93.
<!-- Note 5 - mangelhaft für Inhalt          --> 
94.
 
95.
   <td style="width:10px;"><p> 
96.
     <input type="radio" name="Inhalt" id="mangelhaft" value="5" /> 
97.
   </p></td> 
98.
   <td style="width:1px;"><p>5</p></td> 
99.
 
100.
<!-- Note 6 - ungenügend für Inhalt         --> 
101.
 
102.
   <td style="width:10px;"><p> 
103.
     <input type="radio" name="Inhalt" id="ungenuegend" value="6" /> 
104.
   </p></td> 
105.
   <td style="width:1px;"><p>6</p></td> 
106.
 
107.
</tr> 
108.
 
109.
<!-- ENDE von Inhalt       --> 
110.
 
111.
<!-- ANFANG von Aktualität      --> 
112.
 
113.
 <tr> 
114.
  <td colspan="12"><strong>von der Aktualit&auml;t</strong></td> 
115.
  </tr> 
116.
<!-- Note 1 - sehr gut für Aktualitaet --> 
117.
 
118.
 <tr style="width:10px;"> 
119.
   <td style="width:1px;"><p> 
120.
     <input type="radio" name="Aktualitaet" id="sehr gut" value="1" /> 
121.
   </p></td> 
122.
   <td style="width:1px;"><p>1</p></td> 
123.
 
124.
<!-- Note 2 - gut für Aktualitaet         --> 
125.
 
126.
   <td style="width:10px;"><p> 
127.
     <input type="radio" name="Aktualitaet" id="gut" value="2" /> 
128.
   </p></td> 
129.
   <td style="width:1px;"><p>2</p></td> 
130.
 
131.
<!-- Note 3 - befriedigend für Aktualitaet         --> 
132.
 
133.
   <td style="width:10px;"><p> 
134.
     <input type="radio" name="Aktualitaet" id="befriedigend" value="3" /> 
135.
   </p></td> 
136.
   <td style="width:1px;"><p>3</p></td> 
137.
 
138.
<!-- Note 4 - ausreichend für Aktualitaet         --> 
139.
 
140.
   <td style="width:10px;"><p> 
141.
     <input type="radio" name="Aktualitaet" id="ausreichend" value="4" /> 
142.
   </p></td> 
143.
   <td style="width:1px;"><p>4</p></td> 
144.
 
145.
<!-- Note 5 - mangelhaft für Aktualitaet          --> 
146.
 
147.
   <td style="width:10px;"><p> 
148.
     <input type="radio" name="Aktualitaet" id="mangelhaft" value="5" /> 
149.
   </p></td> 
150.
   <td style="width:1px;"><p>5</p></td> 
151.
 
152.
<!-- Note 6 - ungenügend für Aktualitaet         --> 
153.
 
154.
   <td style="width:10px;"><p> 
155.
     <input type="radio" name="Aktualitaet" id="ungenuegend" value="6" /> 
156.
   </p></td> 
157.
   <td style="width:1px;"><p>6</p></td> 
158.
 
159.
</tr> 
160.
 
161.
<!-- ENDE von Aktualitaet       --> 
162.
 
163.
 
164.
<!-- ANFANG von Umfang     --> 
165.
 
166.
 <tr> 
167.
  <td colspan="12"><strong>vom Umfang (16 Seiten)</strong></td> 
168.
  </tr> 
169.
 
170.
<!-- weniger - für Umfang --> 
171.
 
172.
 <tr style="width:10px;"> 
173.
   <td style="width:10px;"><p> 
174.
     <input type="radio" name="Umfang" id="weniger" value="weniger" /> 
175.
   </p></td> 
176.
   <td style="width:1px;"><p>weniger</p></td> 
177.
 
178.
<!-- ausreichend - für Umfang         --> 
179.
 
180.
   <td style="width:10px;"><p> 
181.
     <input type="radio" name="Umfang" id="ausreichend" value="ausreichend" /> 
182.
   </p></td> 
183.
   <td style="width:1px;"><p>ausreichend</p></td> 
184.
 
185.
<!-- mehr - für Umfang         --> 
186.
 
187.
   <td style="width:10px;"><p> 
188.
     <input type="radio" name="Umfang" id="mehr" value="mehr" /> 
189.
   </p></td> 
190.
   <td style="width:1px;"><p>mehr</p></td> 
191.
 
192.
 </tr> 
193.
<!-- ENDE vom Umfang       --> 
194.
 
195.
<!-- ANFANG von Erscheinungsintervall     --> 
196.
 
197.
 <tr> 
198.
  <td colspan="12"><strong>vom Erscheinungsintervall (4x im Jahr)</strong></td> 
199.
  </tr> 
200.
 
201.
<!-- weniger - für Erscheinungsintervall --> 
202.
 
203.
 <tr style="width:1px;"> 
204.
   <td style="width:1px;"><p> 
205.
     <input type="radio" name="Erscheinungsintervall" id="weniger" value="weniger" /> 
206.
   </p></td> 
207.
   <td style="width:1px;"><p>weniger</p></td> 
208.
 
209.
<!-- ausreichend -  für Erscheinungsintervall         --> 
210.
 
211.
   <td style="width:1px;"><p> 
212.
     <input type="radio" name="Erscheinungsintervall" id="ausreichend" value="ausreichend" /> 
213.
   </p></td> 
214.
   <td style="width:1px;"><p>ausreichend</p></td> 
215.
 
216.
<!-- mehr - für Erscheinungsintervall         --> 
217.
 
218.
   <td style="width:1px;"><p> 
219.
     <input type="radio" name="Erscheinungsintervall" id="mehr" value="mehr" /> 
220.
   </p></td> 
221.
   <td style="width:1px;"><p>mehr</p></td> 
222.
 
223.
</tr> 
224.
 
225.
<!-- ENDE vom Erscheinungsintervall       --> 
226.
 
227.
<!-- ANFANG von Art der Zusendung     --> 
228.
 
229.
 <tr> 
230.
  <td colspan="12"><strong>Wie m&ouml;chten Sie die Zeitung erhalten? </strong></td> 
231.
  </tr> 
232.
 
233.
<!-- Zusendung per Post nach Hause --> 
234.
 
235.
 <tr style="border-bottom: 10px dotted #999999;"> 
236.
   <td style="width:10px;"><p> 
237.
     <input type="radio" name="Zusendung" id="Post" value="Zusendung nach Hause" /> 
238.
   </p></td> 
239.
   <td style="width:200px;"><p>als Druck nach Hause</p></td> 
240.
 
241.
<!--  Einstellung ins Intranet       --> 
242.
 
243.
   <td style="width:10px;"><p> 
244.
     <input type="radio" name="Zusendung" id="Intranet" value="Einstellung ins Intranet" /> 
245.
   </p></td> 
246.
   <td style="width:200px;"><p>jeden Artikel tagesaktuell im Intranet</p></td> 
247.
 
248.
</tr> 
249.
 
250.
<!-- ENDE von Zusendung       --> 
251.
 
252.
 
253.
 <tr><td colspan="12"><p><strong>Anmerkungen, Anregungen, Vorschl&auml;ge: </strong></p></td></tr> 
254.
 <tr><td colspan="12"><textarea name="Anfrage" id="Anfrage" style="width:480px;height:140px;font-family:Verdana,Tahoma,Arial,Helvetica,Sans-serif,sans-serif;font-size:11px;"></textarea></td></tr> 
255.
 <tr> 
256.
   <td colspan="12"><strong>Vielen Dank f&uuml;r Ihre Meinung.</strong><br /> 
257.
   </td> 
258.
 </tr> 
259.
 <tr> 
260.
   <td colspan="12"><input type="submit" value="{ABSCHICKEN}"/></td> 
261.
   </tr> 
262.
 
263.
 
264.
</table> 
265.
 
266.
 
Bitte warten ..
Mitglied: Connor1980
03.08.2010 um 14:32 Uhr
Hallo,

benutze colspan so, z.B.
01.
 <td colspan="5" style="width:200px;"><p>als Druck nach Hause</p></td>
In der Zeile hast du insgesammt 4 Felder die du nun auf die 12 Spalten aufteilst. Da die Radiobuttons immer nur ein Spalte breit sein sollen, machst du den Colspan für den restlichen Text auf die nächsten 5 Spalten. Ich hoffe meine Erklärung sit verständlich.
Entsprechend für die Zeile mit "Umfang" mahcst du 3 Spalten pro Textzelle. Sollte so einigermaßen ok aussehen.

Grüße
Bitte warten ..
Mitglied: eXtremeTK
03.08.2010 um 15:27 Uhr
Moin!

Zwei Leute ein Gedanke :P - habe ich auch so mal "rumprobiert" und es passt tatsächlich.
Sieht zudem sogar gar nicht so blöd aus. Nicht ganz die schickste Lösung, aber sie funktioniert.

VIELEN DANK an das super Forum!!!

01.
 
02.
<table cellspacing="0" cellpadding="0" border="0" style="padding: 10px; border: 1px solid #999999; width: 470px;"> 
03.
 <tr> 
04.
   <td colspan="12"><strong><center>Wie beurteilen Sie die Zeitung</center></strong></td> 
05.
   </tr> 
06.
 
07.
<!-- ANFANG von Optik / Gestaltung       --> 
08.
 
09.
 <tr> 
10.
  <td colspan="12"><strong>in der Optik / Gestaltung</strong></td> 
11.
  </tr> 
12.
<!-- Note 1 - sehr gut für Optik / Gestaltung --> 
13.
 
14.
 <tr> 
15.
   <td style="width:1px;"><p> 
16.
     <input  type="radio" name="Optik" id="sehr gut" value="1" /> 
17.
   </p></td> 
18.
   <td style="width:1px;"><p>1</p></td> 
19.
 
20.
<!-- Note 2 - gut für Optik / Gestaltung         --> 
21.
 
22.
   <td style="width:1px;"><p> 
23.
     <input type="radio" name="Optik" id="gut" value="2" /> 
24.
   </p></td> 
25.
   <td style="width:1px;"><p>2</p></td> 
26.
 
27.
<!-- Note 3 - befriedigend für Optik / Gestaltung         --> 
28.
 
29.
   <td style="width:1px;"><p> 
30.
     <input type="radio" name="Optik" id="befriedigend" value="3" /> 
31.
   </p></td> 
32.
   <td style="width:1;"><p>3</p></td> 
33.
 
34.
<!-- Note 4 - ausreichend für Optik / Gestaltung         --> 
35.
 
36.
   <td style="width:1px;"><p> 
37.
     <input type="radio" name="Optik" id="ausreichend" value="4" /> 
38.
   </p></td> 
39.
   <td style="width:1px;"><p>4</p></td> 
40.
 
41.
<!-- Note 5 - mangelhaft für Optik / Gestaltung         --> 
42.
 
43.
   <td style="width:1px;"><p> 
44.
     <input type="radio" name="Optik" id="mangelhaft" value="5" /> 
45.
   </p></td> 
46.
   <td style="width:1px;"><p>5</p></td> 
47.
 
48.
<!-- Note 6 - ungenügend für Optik / Gestaltung         --> 
49.
 
50.
   <td style="width:1px;"><p> 
51.
     <input type="radio" name="Optik" id="ungenuegend" value="6" /> 
52.
   </p></td> 
53.
   <td style="width:1px;"><p>6</p></td> 
54.
 
55.
</tr> 
56.
 
57.
<!-- ENDE von Optik / Gestaltung       --> 
58.
 
59.
<!-- ANFANG von Inhalt       --> 
60.
 
61.
 <tr> 
62.
  <td colspan="12"><strong>vom Inhalt</strong></td> 
63.
  </tr> 
64.
<!-- Note 1 - sehr gut für Inhalt --> 
65.
 
66.
 <tr style="width:1px;"> 
67.
   <td style="width:1px;"><p> 
68.
     <input type="radio" name="Inhalt" id="sehr gut" value="1" /> 
69.
   </p></td> 
70.
   <td style="width:1px;"><p>1</p></td> 
71.
 
72.
<!-- Note 2 - gut für Inhalt         --> 
73.
 
74.
   <td style="width:10px;"><p> 
75.
     <input type="radio" name="Inhalt" id="gut" value="2" /> 
76.
   </p></td> 
77.
   <td style="width:1px;"><p>2</p></td> 
78.
 
79.
<!-- Note 3 - befriedigend für Inhalt         --> 
80.
 
81.
   <td style="width:10px;"><p> 
82.
     <input type="radio" name="Inhalt" id="befriedigend" value="3" /> 
83.
   </p></td> 
84.
   <td style="width:1px;"><p>3</p></td> 
85.
 
86.
<!-- Note 4 - ausreichend für Inhalt         --> 
87.
 
88.
   <td style="width:10px;"><p> 
89.
     <input type="radio" name="Inhalt" id="ausreichend" value="4" /> 
90.
   </p></td> 
91.
   <td style="width:1px;"><p>4</p></td> 
92.
 
93.
<!-- Note 5 - mangelhaft für Inhalt          --> 
94.
 
95.
   <td style="width:10px;"><p> 
96.
     <input type="radio" name="Inhalt" id="mangelhaft" value="5" /> 
97.
   </p></td> 
98.
   <td style="width:1px;"><p>5</p></td> 
99.
 
100.
<!-- Note 6 - ungenügend für Inhalt         --> 
101.
 
102.
   <td style="width:10px;"><p> 
103.
     <input type="radio" name="Inhalt" id="ungenuegend" value="6" /> 
104.
   </p></td> 
105.
   <td style="width:1px;"><p>6</p></td> 
106.
 
107.
</tr> 
108.
 
109.
<!-- ENDE von Inhalt       --> 
110.
 
111.
<!-- ANFANG von Aktualität      --> 
112.
 
113.
 <tr> 
114.
  <td colspan="12"><strong>von der Aktualit&auml;t</strong></td> 
115.
  </tr> 
116.
<!-- Note 1 - sehr gut für Aktualitaet --> 
117.
 
118.
 <tr style="width:10px;"> 
119.
   <td style="width:1px;"><p> 
120.
     <input type="radio" name="Aktualitaet" id="sehr gut" value="1" /> 
121.
   </p></td> 
122.
   <td style="width:1px;"><p>1</p></td> 
123.
 
124.
<!-- Note 2 - gut für Aktualitaet         --> 
125.
 
126.
   <td style="width:10px;"><p> 
127.
     <input type="radio" name="Aktualitaet" id="gut" value="2" /> 
128.
   </p></td> 
129.
   <td style="width:1px;"><p>2</p></td> 
130.
 
131.
<!-- Note 3 - befriedigend für Aktualitaet         --> 
132.
 
133.
   <td style="width:10px;"><p> 
134.
     <input type="radio" name="Aktualitaet" id="befriedigend" value="3" /> 
135.
   </p></td> 
136.
   <td style="width:1px;"><p>3</p></td> 
137.
 
138.
<!-- Note 4 - ausreichend für Aktualitaet         --> 
139.
 
140.
   <td style="width:10px;"><p> 
141.
     <input type="radio" name="Aktualitaet" id="ausreichend" value="4" /> 
142.
   </p></td> 
143.
   <td style="width:1px;"><p>4</p></td> 
144.
 
145.
<!-- Note 5 - mangelhaft für Aktualitaet          --> 
146.
 
147.
   <td style="width:10px;"><p> 
148.
     <input type="radio" name="Aktualitaet" id="mangelhaft" value="5" /> 
149.
   </p></td> 
150.
   <td style="width:1px;"><p>5</p></td> 
151.
 
152.
<!-- Note 6 - ungenügend für Aktualitaet         --> 
153.
 
154.
   <td style="width:10px;"><p> 
155.
     <input type="radio" name="Aktualitaet" id="ungenuegend" value="6" /> 
156.
   </p></td> 
157.
   <td style="width:1px;"><p>6</p></td> 
158.
 
159.
</tr> 
160.
 
161.
<!-- ENDE von Aktualitaet       --> 
162.
 
163.
 
164.
<!-- ANFANG von Umfang     --> 
165.
 
166.
 <tr> 
167.
  <td colspan="12"><strong>vom Umfang (16 Seiten)</strong></td> 
168.
  </tr> 
169.
 
170.
<!-- weniger - für Umfang --> 
171.
 
172.
 <tr style="width:10px;"> 
173.
   <td style="width:10px;"><p> 
174.
     <input type="radio" name="Umfang" id="weniger" value="weniger" /> 
175.
   </p></td> 
176.
   <td colspan="2" style="width:1px;"><p>weniger</p></td> 
177.
 
178.
<!-- ausreichend - für Umfang         --> 
179.
 
180.
   <td style="width:10px;"><p> 
181.
     <input type="radio" name="Umfang" id="ausreichend" value="ausreichend" /> 
182.
   </p></td> 
183.
   <td colspan="3" style="width:1px;"><p>ausreichend</p></td> 
184.
 
185.
<!-- mehr - für Umfang         --> 
186.
 
187.
   <td style="width:10px;"><p> 
188.
     <input type="radio" name="Umfang" id="mehr" value="mehr" /> 
189.
   </p></td> 
190.
   <td colspan="2" style="width:1px;"><p>mehr</p></td> 
191.
 
192.
 </tr> 
193.
<!-- ENDE vom Umfang       --> 
194.
 
195.
<!-- ANFANG von Erscheinungsintervall     --> 
196.
 
197.
 <tr> 
198.
  <td colspan="12"><strong>vom Erscheinungsintervall (4x im Jahr)</strong></td> 
199.
  </tr> 
200.
 
201.
<!-- weniger - für Erscheinungsintervall --> 
202.
 
203.
 <tr style="width:1px;"> 
204.
   <td style="width:1px;"><p> 
205.
     <input type="radio" name="Erscheinungsintervall" id="weniger" value="weniger" /> 
206.
   </p></td> 
207.
   <td colspan="2" style="width:1px;"><p>weniger</p></td> 
208.
 
209.
<!-- ausreichend -  für Erscheinungsintervall         --> 
210.
 
211.
   <td style="width:1px;"><p> 
212.
     <input type="radio" name="Erscheinungsintervall" id="ausreichend" value="ausreichend" /> 
213.
   </p></td> 
214.
   <td colspan="3" style="width:1px;"><p>ausreichend</p></td> 
215.
 
216.
<!-- mehr - für Erscheinungsintervall         --> 
217.
 
218.
   <td style="width:1px;"><p> 
219.
     <input type="radio" name="Erscheinungsintervall" id="mehr" value="mehr" /> 
220.
   </p></td> 
221.
   <td colspan="2" style="width:1px;"><p>mehr</p></td> 
222.
 
223.
</tr> 
224.
 
225.
<!-- ENDE vom Erscheinungsintervall       --> 
226.
 
227.
<!-- ANFANG von Art der Zusendung     --> 
228.
 
229.
 <tr> 
230.
  <td colspan="12"><strong>Wie m&ouml;chten Sie die Zeitung erhalten? </strong></td> 
231.
  </tr> 
232.
 
233.
<!-- Zusendung per Post nach Hause --> 
234.
 
235.
 <tr style="border-bottom: 10px dotted #999999;"> 
236.
   <td style="width:10px;"><p> 
237.
     <input type="radio" name="Zusendung" id="Post" value="Zusendung nach Hause" /> 
238.
   </p></td> 
239.
   <td colspan="5" style="width:150px;"><p>als Druck nach Hause</p></td> 
240.
 
241.
<!--  Einstellung ins Intranet       --> 
242.
 
243.
   <td style="width:1px;"><p> 
244.
     <input type="radio" name="Zusendung" id="Intranet" value="Einstellung ins Intranet" /> 
245.
   </p></td> 
246.
   <td colspan="6" style="width:150px;"><p>jeden Artikel tagesaktuell im Intranet</p></td> 
247.
 
248.
</tr> 
249.
 
250.
<!-- ENDE von Zusendung       --> 
251.
 
252.
 
253.
 
254.
 
255.
 
256.
 
257.
 <tr><td colspan="12"><p><strong>Anmerkungen, Anregungen, Vorschl&auml;ge: </strong></p></td></tr> 
258.
 <tr><td colspan="12"><textarea name="Anfrage" id="Anfrage" style="width:420px;height:140px;font-family:Verdana,Tahoma,Arial,Helvetica,Sans-serif,sans-serif;font-size:11px;"></textarea></td></tr> 
259.
 <tr> 
260.
   <td colspan="12"><strong>Vielen Dank f&uuml;r Ihre Meinung.</strong><br /> 
261.
   </td> 
262.
 </tr> 
263.
 <tr> 
264.
   <td colspan="12"><input type="submit" value="{ABSCHICKEN}"/></td> 
265.
   </tr> 
266.
 
267.
 
268.
 
269.
</table> 
270.
 
Bitte warten ..
Neuester Wissensbeitrag
Windows 10

Powershell 5 BSOD

(8)

Tipp von agowa338 zum Thema Windows 10 ...

Ähnliche Inhalte
Webentwicklung
gelöst HTML Output in eine txt Datei mit VisualBasicScript (2)

Frage von coca22COCA zum Thema Webentwicklung ...

PHP
gelöst HTML Dropdownmenü auslesen und in PHP als Variable übergeben (35)

Frage von ITFlori zum Thema PHP ...

Outlook & Mail
gelöst Outlook soll grundsätzlich nur HTML-Mails versenden (1)

Frage von Laufenfeuer zum Thema Outlook & Mail ...

Heiß diskutierte Inhalte
Microsoft
Ordner mit LW-Buchstaben versehen und benennen (20)

Frage von Xaero1982 zum Thema Microsoft ...

Outlook & Mail
gelöst Outlook 2010 findet ost datei nicht (19)

Frage von Floh21 zum Thema Outlook & Mail ...

Netzwerkmanagement
gelöst Anregungen, kleiner Betrieb, IT-Umgebung (18)

Frage von Unwichtig zum Thema Netzwerkmanagement ...

Festplatten, SSD, Raid
M.2 SSD wird nicht erkannt (14)

Frage von uridium69 zum Thema Festplatten, SSD, Raid ...