Log in

View Full Version : Cross Browser Height Alignment Issues



johnwboyd
08-04-2015, 05:06 PM
It lays out pretty good in FF but the search bar is too low in Chrome. Also the search icon is too low in FF:

http://www.voiceprocess.net/index2.html

I've been really struggling to make it work. Any help would be greatly appreciated.

The HTML:
http://www.voiceprocess.net/index2.html

The CSS: http://www.voiceprocess.net/style2.css

Beverleyh
08-04-2015, 05:23 PM
It might help if you remove the margin-bottom: 20px; from the search input field, and then add vertical-align: middle; to the submit button.

johnwboyd
08-04-2015, 05:44 PM
It might help if you remove the margin-bottom: 20px; from the search input field, and then add vertical-align: middle; to the submit button.

It worked! Thanks so much! How to move it up more from the bottom?

Beverleyh
08-04-2015, 06:32 PM
I'm on iPhone at the mo so can't test, but what if you put a negative top margin on the form element? Like margin-top: -25px; so you're moving the parent element rather than trying to manipulate each individually.