Verticle rythm interrupted by form elements, ie legend, textarea, input, select.

[GoogleCodeExporter]

Please forgive me if this has already been addressed or fixed.

I am using v0.7 and when I view the example form page provided in the
framework I struggle to get the elements on the page to align to the
baseline (using FireFox 2.0.0.12).

Is the framework meant to function like this? The form elements behave
differently in different browsers.

Forgive me if you are already aware of this.

Original issue reported on code.google.com by sevenup...@gmail.com on 20 Feb 2008 at 5:27

Attachments:

• Blueprint-Forms-Tests_1203528299923.png

[GoogleCodeExporter]

Yes, this is an unresolved issue. :) Thanks. 

If anyone want to have a go at tackling this, go right ahead. It's been on my 
list for quite some time, but I've yet 
to do something about it.

Original comment by ola...@gmail.com on 20 Feb 2008 at 5:41

[GoogleCodeExporter]

I will take a stab at it. Really admire your work by the way.

Can you shed any light on how the font sizes, ems and line height work with one 
another?

Original comment by sevenup...@gmail.com on 20 Feb 2008 at 6:21

[GoogleCodeExporter]

There's really nothing special about it. Every element has to have a height 
equal to a multiple of the standard line 
height, which is 1.5 times the set font size.

By default, the font size is 12px. Each line then has to be a multiple of 12px 
* 1,5 = 18px. 

The reason for using em's instead of pixels for heights, is that the entire 
baseline should shift as expected when the 
font size is changed to, say, 13px. 

I'm sure it's easier to grasp if you've worked with this kind of spacing 
before, and I'll get to the form heights eventually. 
But if want, feel free to throw something up. :)

Original comment by ola...@gmail.com on 20 Feb 2008 at 8:16

[GoogleCodeExporter]

The spacing you've used makes sense. How do you decide what values to use for 
the
font size and what values to use for the line height and margin?

Is there a calculation you use to go from pixels to ems?

Original comment by sevenup...@gmail.com on 21 Feb 2008 at 9:17

[GoogleCodeExporter]

You may wish to add the following directive to your IE.css file

fieldset {padding-top: 0;}

When IE (7) displays a fieldset with a legend the padding is applied *around* 
the
legend, making your layout wonky.

Original comment by devic...@gmail.com on 15 Jul 2008 at 10:33

[GoogleCodeExporter]

Copied to
http://blueprintcss.lighthouseapp.com/projects/15318/tickets/6-verticle-rythm-in
terrupted-by-form-elements-ie-legend-textarea-input-select#ticket-6-1
For details please check the mailinglist's archive

Original comment by horst.gu...@gmail.com on 13 Aug 2008 at 9:34