PDA

View Full Version : form fields don't line up in a panel



bhomass
1 Dec 2007, 2:40 PM
I am using a Panel to contain a group of form fields (using items[]). The fields come out ok, but are not lined up. see attached image.

radio buttons appears to be centered within their containers, and the TextField is further to the left than the combos. I was able to realign them by applying css to generated id, which is clearly not a great solution. Isn't there some convenient way to line up all form fields within one container?

bhomass
1 Dec 2007, 2:43 PM
retry in uploading the image.

efege
1 Dec 2007, 3:49 PM
What code are you using to get that alignment? I tested this simple code and all the fields are shown left-aligned:



new Ext.form.FormPanel({
items: [
{xtype: 'textfield', fieldLabel: 'Serial number'},
{xtype: 'radio', fieldLabel: 'Status', name: 'status', boxLabel: 'all'},
{xtype: 'radio', name: 'status', boxLabel: 'editing', labelSeparator: ''},
{xtype: 'radio', name: 'status', boxLabel: 'shipped', labelSeparator: ''},
{xtype: 'datefield', fieldLabel: 'From date'},
{xtype: 'combo', fieldLabel: 'Agent'}
],
renderTo: document.body
});

tryanDLS
1 Dec 2007, 5:08 PM
Have you got a text-align:center someplace in your CSS?

bhomass
1 Dec 2007, 6:13 PM
thanks.

I did not use text-align:left earlier. I thought that would affect the fieldLabels. But apparently it did not, and fixed only the field alignments.

wisecounselor
5 Dec 2007, 7:31 AM
I have similar problem, I can't figure out how to make 2 radio buttons in a group show on one row, rather than one per row.

tryanDLS
5 Dec 2007, 2:10 PM
I have similar problem, I can't figure out how to make 2 radio buttons in a group show on one row, rather than one per row.


Please don't hijack threads with unrelated questions - it makes threads difficult to follow and makes searching for relevant threads difficult also. There are other threads regarding horizontal alignment of radio buttons.