[TYPO3] Styling forms

Marlies C marliesc_spam at hotmail.com
Wed Mar 7 15:17:03 CET 2007


Sara Weale wrote:
> Can anyone tell me how to force radio buttons to be displayed vertically 
> and not horizontally?
> 
> I have changed from css to tables based layout but am still seeing the 
> <legend> and an odd radio button layout.
> 
> I would rather use a css layout so if anyone can tell me either way how 
> to get the radio buttons  to behave and not display the legend I would 
> be very grateful!
> 
> (Typo3 v4.0.4)
> 
> Tables layout:
> 
> tt_content.mailform.20 {
> layout = <tr><td class="csc-form-labelcell">###LABEL###</td><td 
> class="csc-form-fieldcell">###FIELD###</td></tr>
> RADIO.layout = <tr><td class="csc-form-labelcell">###LABEL###</td><td 
> class="csc-mailform-radio">###FIELD###</td></tr>
> labelWrap.wrap = | <p class="csc-form-label-req">|</p>
> radioWrap.wrap = | <p class="csc-form-radio">|</p>
> stdWrap.wrap = <table border="0" cellspacing="1" cellpadding="1" 
> class="csc-mailform"> | </table>
> }
> 
> CSS layout:
> 
> .csc-mailform-field {
> text-align:left;
> margin-bottom: 10px;
> }
> 
> .csc-mailform-submit {
> text-align:right;
> }
> 
> label {
> float: left;
> width: 250px;
> }
> 
> 
> 
> 
> 

Hi,

This is from my mailform tutorial, make these changes in the form 
template and add the code to the css:

# To keep radio buttons in mailform on same line
  tt_content.mailform.20.RADIO.layout = <tr>
    <td class="csc-form-labelcell">###LABEL###</td>
    <td class="csc-form-fieldradiocell">###FIELD###</td>
  </tr>

.csc-form-fieldradiocell br {
   display: none;
}

Link to my mailform tutorial:
http://www.mcuniverse.com/05/Mailforms-II.79.0.html

Hope this helps.

Marlies


More information about the TYPO3-english mailing list