The right side fieldset- 'Select, checkboxes, lists,' seems to be out of vertical alignment on (I'm viewing it in FF3) but I think this was true previously as well?
On May 28, 4:29 pm, speedunk <[email protected]> wrote: > So I believe I've found a cross-browser solution for aligning form > elements... and I'm looking forward to everyone's response. > > I'm not hip with github just yet, so I've uploaded my code > here:http://tinyurl.com/kk5rmm > > Basically what I've done is add three new classes to the blueprint > framework (form-inline, checkbox, and button). The most important > being form-inline. My style declarations are located the compressed > screen.css and ie.css files to make it quick for me to change... but > I'm hoping this can be added to the BP core (or maybe added as a > plugin?) soon. > > To apply the styles, simply add class="form-inline" to the form > element you wish to be inline (see page source). Also add > class="checkbox" to inputs that are type checkbox and class="button" > to inputs that are type button. > > The styles are as follows: > > for screen.css > .form-inline {line-height:3em;} > .form-inline p {margin-bottom:0;} > input.checkbox {position:relative;top:.25em;} > > for ie.css > .form-inline p {vertical-align:middle;} > .form-inline p label {position:relative;top:-.25em;} > input.checkbox, input.button {margin-top:0.5em;margin-bottom:0.5em;} > > Notice the .button and .checkbox classes are mainly for dealing with > IE and it's weird positioning (in ie.css), but I've also added > the .checkbox class in screen.css to align the form element with the > text. > > I hoping this will be useful to someone. I've tested in IE6, IE7, FF, > and Safari and things are looking good. > > Ciao > Sean K. Stewart > > On May 28, 11:03 am, jsmorris <[email protected]> wrote: > > > Wonderful...thanks. Hopefully this helps to get the elements aligned > > across all browsers. > > > On Thu, May 28, 2009 at 11:42 AM, Josh Clayton <[email protected]> > > wrote: > > > > I've merged this in to Blueprint core > > > > On May 27, 2:43 am, jsmorris <[email protected]> wrote: > > >> I forked blueprint and added a section to the Forms test page as > > >> suggested by Goulven. My fork is > > >> athttp://github.com/jsmorris/blueprint-css/tree/master. I also sent a > > >> pull request to joshuaclayton. > > > >> Jason > > > >> On Mon, May 25, 2009 at 5:23 AM, Goulven CHAMPENOIS > > >> <[email protected]> wrote: > > >> > Indeed, there seems to be a vertical alignment problem with form > > >> > elements. > > >> > It looks like "input.text, input.title, select { margin: 0.5em 0}" in > > >> > screen.css breaks the vertical rhythm (see > > >> >http://www.blueprintcss.org/tests/parts/forms.html). Fieldset and legend > > >> > don't seem to look identical in IE6 and FF. > > > >> > We should update the blueprint form demo with lines of text combining > > >> > different sorts of input and selects and see if there are differences, > > >> > to > > >> > have a clear testcase for Jason's problem. > > > >> > I'll try to look at what's been done on other frameworks too (YUI > > >> > grids, > > >> > 960, etc). > > > >> > In the meantime, has anyone fixed their forms? If so, how? > > > >> > On Wed, May 20, 2009 at 2:48 AM, jsmorris <[email protected]> wrote: > > > >> >> I am getting various behavior across browsers with trying to align > > >> >> labels, selects and input elements across a row. I was hoping that > > >> >> blueprint would help me with this. I am using 0.8. > > > >> > -- > > >> > Goulven Champenois --~--~---------~--~----~------------~-------~--~----~ You received this message because you are subscribed to the Google Groups "Blueprint CSS" group. To post to this group, send email to [email protected] To unsubscribe from this group, send email to [email protected] For more options, visit this group at http://groups.google.com/group/blueprintcss?hl=en -~----------~----~----~----~------~----~------~--~---
