puzzling form alignment behavior

sneakyimp

Ok I've got a form (an image edit toolbar) and I'm getting some really annoying alignment issues. I have some image inputs that align tight to the top in my form while my span tags seem to be forced down from the top of the form. You can see it here:
http://jaith.net/questions/alignment.htm

What's killing me is that the span tags (intended to group logically related form inputs) are forced down a bit despite the fact that the form has padding:0px and at the same time the image inputs align tight to the top.

What's the deal here? I've stripped this form down to the barest basics and there appears to be something really screwy about the alignment. How can I fix this?

reddrum

Have you tryed adding "vertical-align: top;" to your css imageEditSpan class?

troybtj

Looks fine in FireFox2, it is one of the wonderful Explorer Quirks.

I'll try to find the "plugin code" that makes that behave the way it is supposed to in IE, I have it around here. somewhere...

troybtj

Correction: had styles temp disabled in FF2. :rolleyes:

Looking at it with firebug, it seems the input images (rotate) are breaking out of their span parent, I tried adding a class for the images, and that worked, but the images were squished vertically inside the span, only by increasing the font size did I get them to fit. I'll keep playing because now I'm frustrated too. :glare:

--ETA: It lays out nicely if I put the entire form inside a DIV tag with the height, but image size is constrained to font size still.

sneakyimp

Aw forget it. I'm going to use some buttons in a div tag instead. I don't actually need the form because I'm doing mostly AJAX stuff. I really hate weirdness like that. It upsets my sense of order.