PDA

View Full Version : Form Layout - Checkbox Not aligning.



buzz
16 Apr 2007, 8:40 AM
I am unable to align a checkbox in the center of a label field. I have taken the example html from examples/form/form.html and changed the input type of one first text field from "text" to checkbox. I want the label on the left side of the checkbox and aligned with the other labels I have on the form. The layout code I am using is


<div class="x-form-item">
<label for="combo-local">Local Data:</label>
<div class="x-form-element">
<input type="checkbox" name="combo-local" id="combo-local" />
</div>
</div>


If you look at the attachment you will notice that the checkbox is slightly above the label.

brian.moeskau
16 Apr 2007, 8:44 AM
Are you applying an Ext Checkbox to it, or is it just the default browser rendering? The browser default alignment of checkboxes is usually exactly what you've attached.

buzz
16 Apr 2007, 9:43 AM
I wasn't applying Ext.Checkbox to it. I've updated the code to add the following,


var combolocal = new Ext.form.Checkbox();
combolocal.applyTo('combo-local');


No difference. The checkbox alignment is still off

tryanDLS
16 Apr 2007, 10:28 AM
Use firebug to compare the rendered HTML of your checkbox to one of the ones from the dynamic forms example? Is it not generating the same div wrappers when the element exists vs when it's created from scratch. Is this with the latest 1.0 code? Is it the same on IE or FF?