CODEWITHSUNDEEP
cssinternet-explorerfirefox
Hank
Hank

Reputation: 23

CSS: Why is my form submit button on a new line?

On my web site, http://tinyurl.com/yhvj6g

Why is it that Internet Explorer is placing my "Find listing" submit button on a new line whereas Firefox & Chrome keep the submit button inline horizontally with the input field (which is the desired result)?

I would like Internet Explorer to behave the same as Firefox & Chrome in that it keeps the "Find Listings" submit button horizontally inline with the input field.

I assume this is a CSS issue. Any help would be appreciated. Thanks

Upvotes: 2

Views: 1418

Answers (3)

Hank
Hank

Reputation: 23

I figured it out. My FORM width was not wide enough

Upvotes: 0

Marek Karbarz
Marek Karbarz

Reputation: 29294

try setting width on that button so that textbox + button + padding < 400px (size of your container). Seems to me that the button slips to the second line simply because it's too wide to fit on the same line

Upvotes: 2

Jim Garrison
Jim Garrison

Reputation: 86764

Looking at both, the button is significantly wider in IE than in Firefox. I'd guess that it's too wide to fit in the available space on IE, and is getting moved to the next "line". Try reducing the padding to 0 on the button and see what happens; also, you might put the form inside an explicitly-sized div to force enough room.

Upvotes: 1

Related Questions