Wed, 2010-01-20 11:39
Hey guys,
I have been working on a design and have come across an issue I have had for some time now but it has really bugged me this time as I have just checked it on Chrome and IE!! yes IE and they both display this fine however firefox has a freak issue and no matter what I do it doesn't change.
Okay so I design my forms without tables but they display inline with each other you can see here: http://w3hut.com/form-example.html
However if you look on FF you can see the input boxes are aligned below the labels which has really began to bug me.
Now if you take a look at the same page in IE, Chrome, Opera or Safari it displays the way I want it to display, with them aligning as if they were floated next to each other.
Does anyone know why this happens?
Thanks as always,
Josh Connerty.
Wed, 2010-01-20 12:03
#1
Safari on a Mac has a
Safari on a Mac has a slightly darker border around the form other than that FF3.5.7 on the Mac displays the same.
Mods and gurus – THANK YOU!
For your time, knowledge and experience so willingly and generously given.
Please come back tomorrow and sort us all out again 
Wed, 2010-01-20 12:23
#2
Don't use display:
Don't use display: inline-block on the labels, use float: left instead.
Wed, 2010-01-20 12:57
#3
you can add
you can add
input { position:relative; top:-8px; }
to fix but i agreed use float:left to the label.
Wed, 2010-01-20 13:29
#4
Yup that's done the trick
Yup that's done the trick Tyssen cheers.