extremetk
Goto Top

HTML Umfrageformular - Spaltenbreiten

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!


<table cellspacing="0" cellpadding="0" border="0" style="padding: 10px; border: 1px solid #999999; width: 470px;">  
 <tr>
   <td colspan="4"><strong><center>Wie beurteilen Sie die Zeitung</center></strong></td>  
   </tr>

<!-- ANFANG von Optik / Gestaltung       -->

 <tr>
  <td colspan="3"><strong>in der Optik / Gestaltung</strong></td>  
  </tr>
<!-- Note 1 - sehr gut für Optik / Gestaltung -->

 <tr style="width:10px;border-bottom: 1px dotted #999999;">  
   <td style="width:1px;border-bottom: 1px dotted #999999;"><p>  
     <input type="radio" name="Optik" id="sehr gut" value="1" />  
   </p></td>
   <td style="width:40px;border-bottom: 1px dotted #999999;"><p>1</p></td>  

<!-- Note 2 - gut für Optik / Gestaltung         -->

   <td style="width:10px;border-bottom: 1px dotted #999999;"><p>  
     <input type="radio" name="Optik" id="gut" value="2" />  
   </p></td>
   <td style="width:40px;border-bottom: 1px dotted #999999;"><p>2</p></td>  

<!-- Note 3 - befriedigend für Optik / Gestaltung         -->

   <td style="width:10px;border-bottom: 1px dotted #999999;"><p>  
     <input type="radio" name="Optik" id="befriedigend" value="3" />  
   </p></td>
   <td style="width:40;border-bottom: 1px dotted #999999;"><p>3</p></td>  

<!-- Note 4 - ausreichend für Optik / Gestaltung         -->

   <td style="width:10px;border-bottom: 1px dotted #999999;"><p>  
     <input type="radio" name="Optik" id="ausreichend" value="4" />  
   </p></td>
   <td style="width:40px;border-bottom: 1px dotted #999999;"><p>4</p></td>  

<!-- Note 5 - mangelhaft für Optik / Gestaltung         -->

   <td style="width:10px;border-bottom: 1px dotted #999999;"><p>  
     <input type="radio" name="Optik" id="mangelhaft" value="5" />  
   </p></td>
   <td style="width:40px;border-bottom: 1px dotted #999999;"><p>5</p></td>  

<!-- Note 6 - ungenügend für Optik / Gestaltung         -->

   <td style="width:10px;border-bottom: 1px dotted #999999;"><p>  
     <input type="radio" name="Optik" id="ungenuegend" value="6" />  
   </p></td>
   <td style="width:40px;border-bottom: 1px dotted #999999;"><p>6</p></td>  

</tr>

<!-- ENDE von Optik / Gestaltung       -->

<!-- ANFANG von Inhalt       -->

 <tr>
  <td colspan="3"><strong>vom Inhalt</strong></td>  
  </tr>
<!-- Note 1 - sehr gut für Inhalt -->

 <tr style="width:10px;border-bottom: 1px dotted #999999;">  
   <td style="width:1px;border-bottom: 1px dotted #999999;"><p>  
     <input type="radio" name="Inhalt" id="sehr gut" value="1" />  
   </p></td>
   <td style="width:40px;border-bottom: 1px dotted #999999;"><p>1</p></td>  

<!-- Note 2 - gut für Inhalt         -->

   <td style="width:10px;border-bottom: 1px dotted #999999;"><p>  
     <input type="radio" name="Inhalt" id="gut" value="2" />  
   </p></td>
   <td style="width:40px;border-bottom: 1px dotted #999999;"><p>2</p></td>  

<!-- Note 3 - befriedigend für Inhalt         -->

   <td style="width:10px;border-bottom: 1px dotted #999999;"><p>  
     <input type="radio" name="Inhalt" id="befriedigend" value="3" />  
   </p></td>
   <td style="width:40px;border-bottom: 1px dotted #999999;"><p>3</p></td>  

<!-- Note 4 - ausreichend für Inhalt         -->

   <td style="width:10px;border-bottom: 1px dotted #999999;"><p>  
     <input type="radio" name="Inhalt" id="ausreichend" value="4" />  
   </p></td>
   <td style="width:40px;border-bottom: 1px dotted #999999;"><p>4</p></td>  

<!-- Note 5 - mangelhaft für Inhalt          -->

   <td style="width:10px;border-bottom: 1px dotted #999999;"><p>  
     <input type="radio" name="Inhalt" id="mangelhaft" value="5" />  
   </p></td>
   <td style="width:40px;border-bottom: 1px dotted #999999;"><p>5</p></td>  

<!-- Note 6 - ungenügend für Inhalt         -->

   <td style="width:10px;border-bottom: 1px dotted #999999;"><p>  
     <input type="radio" name="Inhalt" id="ungenuegend" value="6" />  
   </p></td>
   <td style="width:40px;border-bottom: 1px dotted #999999;"><p>6</p></td>  

</tr>

<!-- ENDE von Inhalt       -->

<!-- ANFANG von Aktualität      -->

 <tr>
  <td colspan="3"><strong>von der Aktualit&auml;t</strong></td>  
  </tr>
<!-- Note 1 - sehr gut für Aktualitaet -->

 <tr style="width:10px;border-bottom: 1px dotted #999999;">  
   <td style="width:1px;border-bottom: 1px dotted #999999;"><p>  
     <input type="radio" name="Aktualitaet" id="sehr gut" value="1" />  
   </p></td>
   <td style="width:40px;border-bottom: 1px dotted #999999;"><p>1</p></td>  

<!-- Note 2 - gut für Aktualitaet         -->

   <td style="width:10px;border-bottom: 1px dotted #999999;"><p>  
     <input type="radio" name="Aktualitaet" id="gut" value="2" />  
   </p></td>
   <td style="width:40px;border-bottom: 1px dotted #999999;"><p>2</p></td>  

<!-- Note 3 - befriedigend für Aktualitaet         -->

   <td style="width:10px;border-bottom: 1px dotted #999999;"><p>  
     <input type="radio" name="Aktualitaet" id="befriedigend" value="3" />  
   </p></td>
   <td style="width:40px;border-bottom: 1px dotted #999999;"><p>3</p></td>  

<!-- Note 4 - ausreichend für Aktualitaet         -->

   <td style="width:10px;border-bottom: 1px dotted #999999;"><p>  
     <input type="radio" name="Aktualitaet" id="ausreichend" value="4" />  
   </p></td>
   <td style="width:40px;border-bottom: 1px dotted #999999;"><p>4</p></td>  

<!-- Note 5 - mangelhaft für Aktualitaet          -->

   <td style="width:10px;border-bottom: 1px dotted #999999;"><p>  
     <input type="radio" name="Aktualitaet" id="mangelhaft" value="5" />  
   </p></td>
   <td style="width:40px;border-bottom: 1px dotted #999999;"><p>5</p></td>  

<!-- Note 6 - ungenügend für Aktualitaet         -->

   <td style="width:10px;border-bottom: 1px dotted #999999;"><p>  
     <input type="radio" name="Aktualitaet" id="ungenuegend" value="6" />  
   </p></td>
   <td style="width:40px;border-bottom: 1px dotted #999999;"><p>6</p></td>  

</tr>

<!-- ENDE von Aktualitaet       -->


<!-- ANFANG von Umfang     -->

 <tr>
  <td colspan="3"><strong>vom Umfang (16 Seiten)</strong></td>  
  </tr>

<!-- weniger - für Umfang -->

 <tr style="width:10px;border-bottom: 1px dotted #999999;">  
   <td style="width:10px;border-bottom: 1px dotted #999999;"><p>  
     <input type="radio" name="Umfang" id="weniger" value="weniger" />  
   </p></td>
   <td style="width:40px;border-bottom: 1px dotted #999999;"><p>weniger</p></td>  

<!-- ausreichend - für Umfang         -->

   <td style="width:10px;border-bottom: 1px dotted #999999;"><p>  
     <input type="radio" name="Umfang" id="ausreichend" value="ausreichend" />  
   </p></td>
   <td style="width:40px;border-bottom: 1px dotted #999999;"><p>ausreichend</p></td>  

<!-- mehr - für Umfang         -->

   <td style="width:10px;border-bottom: 1px dotted #999999;"><p>  
     <input type="radio" name="Umfang" id="mehr" value="mehr" />  
   </p></td>
   <td style="width:40px;border-bottom: 1px dotted #999999;"><p>mehr</p></td>  

 </tr>
<!-- ENDE vom Umfang       -->

<!-- ANFANG von Erscheinungsintervall     -->

 <tr>
  <td colspan="3"><strong>vom Erscheinungsintervall (4x im Jahr)</strong></td>  
  </tr>

<!-- weniger - für Erscheinungsintervall -->

 <tr style="width:1px;border-bottom: 1px dotted #999999;">  
   <td style="width:1px;border-bottom: 1px dotted #999999;"><p>  
     <input type="radio" name="Erscheinungsintervall" id="weniger" value="weniger" />  
   </p></td>
   <td style="width:150px;border-bottom: 1px dotted #999999;"><p>weniger</p></td>  

<!-- ausreichend -  für Erscheinungsintervall         -->

   <td style="width:1px;border-bottom: 1px dotted #999999;"><p>  
     <input type="radio" name="Erscheinungsintervall" id="ausreichend" value="ausreichend" />  
   </p></td>
   <td style="width:150px;border-bottom: 1px dotted #999999;"><p>ausreichend</p></td>  

<!-- mehr - für Erscheinungsintervall         -->

   <td style="width:1px;border-bottom: 1px dotted #999999;"><p>  
     <input type="radio" name="Erscheinungsintervall" id="mehr" value="mehr" />  
   </p></td>
   <td style="width:150px;border-bottom: 1px dotted #999999;"><p>mehr</p></td>  

</tr>

<!-- ENDE vom Erscheinungsintervall       -->

<!-- ANFANG von Art der Zusendung     -->

 <tr>
  <td colspan="3"><strong>Wie m&ouml;chten Sie die Zeitung erhalten? </strong></td>  
  </tr>

<!-- Zusendung per Post nach Hause -->

 <tr style="border-bottom: 10px dotted #999999;">  
   <td style="width:200px;border-bottom: 1px dotted #999999;"><p>  
     <input type="radio" name="Zusendung" id="Post" value="Zusendung nach Hause" />  
   </p></td>
   <td style="width:300px;border-bottom: 1px dotted #999999;"><p>als Druck nach Hause</p></td>  

<!--  Einstellung ins Intranet       -->

   <td style="width:200px;border-bottom: 1px dotted #999999;"><p>  
     <input type="radio" name="Zusendung" id="Intranet" value="Einstellung ins Intranet" />  
   </p></td>
   <td style="width:300px;border-bottom: 1px dotted #999999;"><p>jeden Artikel tagesaktuell im Intranet</p></td>  

</tr>

<!-- ENDE von Zusendung       -->


 <tr><td colspan="4"><p><strong>Anmerkungen, Anregungen, Vorschl&auml;ge: </strong></p></td></tr>  
 <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>  
 <tr>
   <td colspan="4"><strong>Vielen Dank f&uuml;r Ihre Meinung.</strong><br />  
   </td>
 </tr>
 <tr>
   <td colspan="4"><input type="submit" value="{ABSCHICKEN}"/></td>  
   </tr>


</table>

Content-Key: 148206

Url: https://administrator.de/contentid/148206

Ausgedruckt am: 28.03.2024 um 09:03 Uhr

Mitglied: Connor1980
Connor1980 03.08.2010 um 12:32:47 Uhr
Goto Top
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
Mitglied: mkuchen
mkuchen 03.08.2010 um 12:33:30 Uhr
Goto Top
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 ....
Mitglied: laster
laster 03.08.2010 um 12:41:14 Uhr
Goto Top
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
Mitglied: eXtremeTK
eXtremeTK 03.08.2010 um 13:11:36 Uhr
Goto Top
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
Mitglied: Privateer3000
Privateer3000 03.08.2010 um 13:38:24 Uhr
Goto Top
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.
Mitglied: eXtremeTK
eXtremeTK 03.08.2010 um 13:56:42 Uhr
Goto Top
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:

<table cellspacing="0" cellpadding="0" border="1" style="padding: 10px; border: 1px solid #999999; width: 470px;">  
 <tr>
   <td colspan="12"><strong><center>Wie beurteilen Sie die Zeitung</center></strong></td>  
   </tr>

<!-- ANFANG von Optik / Gestaltung       -->

 <tr>
  <td colspan="12"><strong>in der Optik / Gestaltung</strong></td>  
  </tr>
<!-- Note 1 - sehr gut für Optik / Gestaltung -->

 <tr>
   <td style="width:1px;"><p>  
     <input type="radio" name="Optik" id="sehr gut" value="1" />  
   </p></td>
   <td style="width:1px;"><p>1</p></td>  

<!-- Note 2 - gut für Optik / Gestaltung         -->

   <td style="width:1px;"><p>  
     <input type="radio" name="Optik" id="gut" value="2" />  
   </p></td>
   <td style="width:1px;"><p>2</p></td>  

<!-- Note 3 - befriedigend für Optik / Gestaltung         -->

   <td style="width:1px;"><p>  
     <input type="radio" name="Optik" id="befriedigend" value="3" />  
   </p></td>
   <td style="width:1;"><p>3</p></td>  

<!-- Note 4 - ausreichend für Optik / Gestaltung         -->

   <td style="width:1px;"><p>  
     <input type="radio" name="Optik" id="ausreichend" value="4" />  
   </p></td>
   <td style="width:1px;"><p>4</p></td>  

<!-- Note 5 - mangelhaft für Optik / Gestaltung         -->

   <td style="width:1px;"><p>  
     <input type="radio" name="Optik" id="mangelhaft" value="5" />  
   </p></td>
   <td style="width:1px;"><p>5</p></td>  

<!-- Note 6 - ungenügend für Optik / Gestaltung         -->

   <td style="width:1px;"><p>  
     <input type="radio" name="Optik" id="ungenuegend" value="6" />  
   </p></td>
   <td style="width:1px;"><p>6</p></td>  

</tr>

<!-- ENDE von Optik / Gestaltung       -->

<!-- ANFANG von Inhalt       -->

 <tr>
  <td colspan="12"><strong>vom Inhalt</strong></td>  
  </tr>
<!-- Note 1 - sehr gut für Inhalt -->

 <tr style="width:1px;">  
   <td style="width:1px;"><p>  
     <input type="radio" name="Inhalt" id="sehr gut" value="1" />  
   </p></td>
   <td style="width:1px;"><p>1</p></td>  

<!-- Note 2 - gut für Inhalt         -->

   <td style="width:10px;"><p>  
     <input type="radio" name="Inhalt" id="gut" value="2" />  
   </p></td>
   <td style="width:1px;"><p>2</p></td>  

<!-- Note 3 - befriedigend für Inhalt         -->

   <td style="width:10px;"><p>  
     <input type="radio" name="Inhalt" id="befriedigend" value="3" />  
   </p></td>
   <td style="width:1px;"><p>3</p></td>  

<!-- Note 4 - ausreichend für Inhalt         -->

   <td style="width:10px;"><p>  
     <input type="radio" name="Inhalt" id="ausreichend" value="4" />  
   </p></td>
   <td style="width:1px;"><p>4</p></td>  

<!-- Note 5 - mangelhaft für Inhalt          -->

   <td style="width:10px;"><p>  
     <input type="radio" name="Inhalt" id="mangelhaft" value="5" />  
   </p></td>
   <td style="width:1px;"><p>5</p></td>  

<!-- Note 6 - ungenügend für Inhalt         -->

   <td style="width:10px;"><p>  
     <input type="radio" name="Inhalt" id="ungenuegend" value="6" />  
   </p></td>
   <td style="width:1px;"><p>6</p></td>  

</tr>

<!-- ENDE von Inhalt       -->

<!-- ANFANG von Aktualität      -->

 <tr>
  <td colspan="12"><strong>von der Aktualit&auml;t</strong></td>  
  </tr>
<!-- Note 1 - sehr gut für Aktualitaet -->

 <tr style="width:10px;">  
   <td style="width:1px;"><p>  
     <input type="radio" name="Aktualitaet" id="sehr gut" value="1" />  
   </p></td>
   <td style="width:1px;"><p>1</p></td>  

<!-- Note 2 - gut für Aktualitaet         -->

   <td style="width:10px;"><p>  
     <input type="radio" name="Aktualitaet" id="gut" value="2" />  
   </p></td>
   <td style="width:1px;"><p>2</p></td>  

<!-- Note 3 - befriedigend für Aktualitaet         -->

   <td style="width:10px;"><p>  
     <input type="radio" name="Aktualitaet" id="befriedigend" value="3" />  
   </p></td>
   <td style="width:1px;"><p>3</p></td>  

<!-- Note 4 - ausreichend für Aktualitaet         -->

   <td style="width:10px;"><p>  
     <input type="radio" name="Aktualitaet" id="ausreichend" value="4" />  
   </p></td>
   <td style="width:1px;"><p>4</p></td>  

<!-- Note 5 - mangelhaft für Aktualitaet          -->

   <td style="width:10px;"><p>  
     <input type="radio" name="Aktualitaet" id="mangelhaft" value="5" />  
   </p></td>
   <td style="width:1px;"><p>5</p></td>  

<!-- Note 6 - ungenügend für Aktualitaet         -->

   <td style="width:10px;"><p>  
     <input type="radio" name="Aktualitaet" id="ungenuegend" value="6" />  
   </p></td>
   <td style="width:1px;"><p>6</p></td>  

</tr>

<!-- ENDE von Aktualitaet       -->


<!-- ANFANG von Umfang     -->

 <tr>
  <td colspan="12"><strong>vom Umfang (16 Seiten)</strong></td>  
  </tr>

<!-- weniger - für Umfang -->

 <tr style="width:10px;">  
   <td style="width:10px;"><p>  
     <input type="radio" name="Umfang" id="weniger" value="weniger" />  
   </p></td>
   <td style="width:1px;"><p>weniger</p></td>  

<!-- ausreichend - für Umfang         -->

   <td style="width:10px;"><p>  
     <input type="radio" name="Umfang" id="ausreichend" value="ausreichend" />  
   </p></td>
   <td style="width:1px;"><p>ausreichend</p></td>  

<!-- mehr - für Umfang         -->

   <td style="width:10px;"><p>  
     <input type="radio" name="Umfang" id="mehr" value="mehr" />  
   </p></td>
   <td style="width:1px;"><p>mehr</p></td>  

 </tr>
<!-- ENDE vom Umfang       -->

<!-- ANFANG von Erscheinungsintervall     -->

 <tr>
  <td colspan="12"><strong>vom Erscheinungsintervall (4x im Jahr)</strong></td>  
  </tr>

<!-- weniger - für Erscheinungsintervall -->

 <tr style="width:1px;">  
   <td style="width:1px;"><p>  
     <input type="radio" name="Erscheinungsintervall" id="weniger" value="weniger" />  
   </p></td>
   <td style="width:1px;"><p>weniger</p></td>  

<!-- ausreichend -  für Erscheinungsintervall         -->

   <td style="width:1px;"><p>  
     <input type="radio" name="Erscheinungsintervall" id="ausreichend" value="ausreichend" />  
   </p></td>
   <td style="width:1px;"><p>ausreichend</p></td>  

<!-- mehr - für Erscheinungsintervall         -->

   <td style="width:1px;"><p>  
     <input type="radio" name="Erscheinungsintervall" id="mehr" value="mehr" />  
   </p></td>
   <td style="width:1px;"><p>mehr</p></td>  

</tr>

<!-- ENDE vom Erscheinungsintervall       -->

<!-- ANFANG von Art der Zusendung     -->

 <tr>
  <td colspan="12"><strong>Wie m&ouml;chten Sie die Zeitung erhalten? </strong></td>  
  </tr>

<!-- Zusendung per Post nach Hause -->

 <tr style="border-bottom: 10px dotted #999999;">  
   <td style="width:10px;"><p>  
     <input type="radio" name="Zusendung" id="Post" value="Zusendung nach Hause" />  
   </p></td>
   <td style="width:200px;"><p>als Druck nach Hause</p></td>  

<!--  Einstellung ins Intranet       -->

   <td style="width:10px;"><p>  
     <input type="radio" name="Zusendung" id="Intranet" value="Einstellung ins Intranet" />  
   </p></td>
   <td style="width:200px;"><p>jeden Artikel tagesaktuell im Intranet</p></td>  

</tr>

<!-- ENDE von Zusendung       -->


 <tr><td colspan="12"><p><strong>Anmerkungen, Anregungen, Vorschl&auml;ge: </strong></p></td></tr>  
 <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>  
 <tr>
   <td colspan="12"><strong>Vielen Dank f&uuml;r Ihre Meinung.</strong><br />  
   </td>
 </tr>
 <tr>
   <td colspan="12"><input type="submit" value="{ABSCHICKEN}"/></td>  
   </tr>


</table>
Mitglied: Connor1980
Connor1980 03.08.2010 um 14:32:41 Uhr
Goto Top
Hallo,

benutze colspan so, z.B.
 <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
Mitglied: eXtremeTK
eXtremeTK 03.08.2010 um 15:27:12 Uhr
Goto Top
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!!!

<table cellspacing="0" cellpadding="0" border="0" style="padding: 10px; border: 1px solid #999999; width: 470px;">  
 <tr>
   <td colspan="12"><strong><center>Wie beurteilen Sie die Zeitung</center></strong></td>  
   </tr>

<!-- ANFANG von Optik / Gestaltung       -->

 <tr>
  <td colspan="12"><strong>in der Optik / Gestaltung</strong></td>  
  </tr>
<!-- Note 1 - sehr gut für Optik / Gestaltung -->

 <tr>
   <td style="width:1px;"><p>  
     <input  type="radio" name="Optik" id="sehr gut" value="1" />  
   </p></td>
   <td style="width:1px;"><p>1</p></td>  

<!-- Note 2 - gut für Optik / Gestaltung         -->

   <td style="width:1px;"><p>  
     <input type="radio" name="Optik" id="gut" value="2" />  
   </p></td>
   <td style="width:1px;"><p>2</p></td>  

<!-- Note 3 - befriedigend für Optik / Gestaltung         -->

   <td style="width:1px;"><p>  
     <input type="radio" name="Optik" id="befriedigend" value="3" />  
   </p></td>
   <td style="width:1;"><p>3</p></td>  

<!-- Note 4 - ausreichend für Optik / Gestaltung         -->

   <td style="width:1px;"><p>  
     <input type="radio" name="Optik" id="ausreichend" value="4" />  
   </p></td>
   <td style="width:1px;"><p>4</p></td>  

<!-- Note 5 - mangelhaft für Optik / Gestaltung         -->

   <td style="width:1px;"><p>  
     <input type="radio" name="Optik" id="mangelhaft" value="5" />  
   </p></td>
   <td style="width:1px;"><p>5</p></td>  

<!-- Note 6 - ungenügend für Optik / Gestaltung         -->

   <td style="width:1px;"><p>  
     <input type="radio" name="Optik" id="ungenuegend" value="6" />  
   </p></td>
   <td style="width:1px;"><p>6</p></td>  

</tr>

<!-- ENDE von Optik / Gestaltung       -->

<!-- ANFANG von Inhalt       -->

 <tr>
  <td colspan="12"><strong>vom Inhalt</strong></td>  
  </tr>
<!-- Note 1 - sehr gut für Inhalt -->

 <tr style="width:1px;">  
   <td style="width:1px;"><p>  
     <input type="radio" name="Inhalt" id="sehr gut" value="1" />  
   </p></td>
   <td style="width:1px;"><p>1</p></td>  

<!-- Note 2 - gut für Inhalt         -->

   <td style="width:10px;"><p>  
     <input type="radio" name="Inhalt" id="gut" value="2" />  
   </p></td>
   <td style="width:1px;"><p>2</p></td>  

<!-- Note 3 - befriedigend für Inhalt         -->

   <td style="width:10px;"><p>  
     <input type="radio" name="Inhalt" id="befriedigend" value="3" />  
   </p></td>
   <td style="width:1px;"><p>3</p></td>  

<!-- Note 4 - ausreichend für Inhalt         -->

   <td style="width:10px;"><p>  
     <input type="radio" name="Inhalt" id="ausreichend" value="4" />  
   </p></td>
   <td style="width:1px;"><p>4</p></td>  

<!-- Note 5 - mangelhaft für Inhalt          -->

   <td style="width:10px;"><p>  
     <input type="radio" name="Inhalt" id="mangelhaft" value="5" />  
   </p></td>
   <td style="width:1px;"><p>5</p></td>  

<!-- Note 6 - ungenügend für Inhalt         -->

   <td style="width:10px;"><p>  
     <input type="radio" name="Inhalt" id="ungenuegend" value="6" />  
   </p></td>
   <td style="width:1px;"><p>6</p></td>  

</tr>

<!-- ENDE von Inhalt       -->

<!-- ANFANG von Aktualität      -->

 <tr>
  <td colspan="12"><strong>von der Aktualit&auml;t</strong></td>  
  </tr>
<!-- Note 1 - sehr gut für Aktualitaet -->

 <tr style="width:10px;">  
   <td style="width:1px;"><p>  
     <input type="radio" name="Aktualitaet" id="sehr gut" value="1" />  
   </p></td>
   <td style="width:1px;"><p>1</p></td>  

<!-- Note 2 - gut für Aktualitaet         -->

   <td style="width:10px;"><p>  
     <input type="radio" name="Aktualitaet" id="gut" value="2" />  
   </p></td>
   <td style="width:1px;"><p>2</p></td>  

<!-- Note 3 - befriedigend für Aktualitaet         -->

   <td style="width:10px;"><p>  
     <input type="radio" name="Aktualitaet" id="befriedigend" value="3" />  
   </p></td>
   <td style="width:1px;"><p>3</p></td>  

<!-- Note 4 - ausreichend für Aktualitaet         -->

   <td style="width:10px;"><p>  
     <input type="radio" name="Aktualitaet" id="ausreichend" value="4" />  
   </p></td>
   <td style="width:1px;"><p>4</p></td>  

<!-- Note 5 - mangelhaft für Aktualitaet          -->

   <td style="width:10px;"><p>  
     <input type="radio" name="Aktualitaet" id="mangelhaft" value="5" />  
   </p></td>
   <td style="width:1px;"><p>5</p></td>  

<!-- Note 6 - ungenügend für Aktualitaet         -->

   <td style="width:10px;"><p>  
     <input type="radio" name="Aktualitaet" id="ungenuegend" value="6" />  
   </p></td>
   <td style="width:1px;"><p>6</p></td>  

</tr>

<!-- ENDE von Aktualitaet       -->


<!-- ANFANG von Umfang     -->

 <tr>
  <td colspan="12"><strong>vom Umfang (16 Seiten)</strong></td>  
  </tr>

<!-- weniger - für Umfang -->

 <tr style="width:10px;">  
   <td style="width:10px;"><p>  
     <input type="radio" name="Umfang" id="weniger" value="weniger" />  
   </p></td>
   <td colspan="2" style="width:1px;"><p>weniger</p></td>  

<!-- ausreichend - für Umfang         -->

   <td style="width:10px;"><p>  
     <input type="radio" name="Umfang" id="ausreichend" value="ausreichend" />  
   </p></td>
   <td colspan="3" style="width:1px;"><p>ausreichend</p></td>  

<!-- mehr - für Umfang         -->

   <td style="width:10px;"><p>  
     <input type="radio" name="Umfang" id="mehr" value="mehr" />  
   </p></td>
   <td colspan="2" style="width:1px;"><p>mehr</p></td>  

 </tr>
<!-- ENDE vom Umfang       -->

<!-- ANFANG von Erscheinungsintervall     -->

 <tr>
  <td colspan="12"><strong>vom Erscheinungsintervall (4x im Jahr)</strong></td>  
  </tr>

<!-- weniger - für Erscheinungsintervall -->

 <tr style="width:1px;">  
   <td style="width:1px;"><p>  
     <input type="radio" name="Erscheinungsintervall" id="weniger" value="weniger" />  
   </p></td>
   <td colspan="2" style="width:1px;"><p>weniger</p></td>  

<!-- ausreichend -  für Erscheinungsintervall         -->

   <td style="width:1px;"><p>  
     <input type="radio" name="Erscheinungsintervall" id="ausreichend" value="ausreichend" />  
   </p></td>
   <td colspan="3" style="width:1px;"><p>ausreichend</p></td>  

<!-- mehr - für Erscheinungsintervall         -->

   <td style="width:1px;"><p>  
     <input type="radio" name="Erscheinungsintervall" id="mehr" value="mehr" />  
   </p></td>
   <td colspan="2" style="width:1px;"><p>mehr</p></td>  

</tr>

<!-- ENDE vom Erscheinungsintervall       -->

<!-- ANFANG von Art der Zusendung     -->

 <tr>
  <td colspan="12"><strong>Wie m&ouml;chten Sie die Zeitung erhalten? </strong></td>  
  </tr>

<!-- Zusendung per Post nach Hause -->

 <tr style="border-bottom: 10px dotted #999999;">  
   <td style="width:10px;"><p>  
     <input type="radio" name="Zusendung" id="Post" value="Zusendung nach Hause" />  
   </p></td>
   <td colspan="5" style="width:150px;"><p>als Druck nach Hause</p></td>  

<!--  Einstellung ins Intranet       -->

   <td style="width:1px;"><p>  
     <input type="radio" name="Zusendung" id="Intranet" value="Einstellung ins Intranet" />  
   </p></td>
   <td colspan="6" style="width:150px;"><p>jeden Artikel tagesaktuell im Intranet</p></td>  

</tr>

<!-- ENDE von Zusendung       -->






 <tr><td colspan="12"><p><strong>Anmerkungen, Anregungen, Vorschl&auml;ge: </strong></p></td></tr>  
 <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>  
 <tr>
   <td colspan="12"><strong>Vielen Dank f&uuml;r Ihre Meinung.</strong><br />  
   </td>
 </tr>
 <tr>
   <td colspan="12"><input type="submit" value="{ABSCHICKEN}"/></td>  
   </tr>



</table>