homepage Welcome to WebmasterWorld Guest from
register, free tools, login, search, pro membership, help, library, announcements, recent posts, open posts,
Pubcon Platinum Sponsor 2014
Home / Forums Index / Code, Content, and Presentation / CSS
Forum Library, Charter, Moderators: not2easy

CSS Forum

align inputs in ie6 and ie7

Msg#: 4320814 posted 11:50 pm on Jun 1, 2011 (gmt 0)

Hi I'm having problems getting my search box and it's search button to line up properly in ie6 & 7. In FF opera and safari and ie8 they seem ok, in that the button and the search input are beside each other.

The problem can be seen [belfastswimmingteacher.com ]



WebmasterWorld Senior Member 5+ Year Member

Msg#: 4320814 posted 9:40 am on Jun 3, 2011 (gmt 0)

Hi barricades [webmasterworld.com] and welcome to WebmasterWorld :)

Can you explain what you mean by "line-up" - it could mean many different things!

When I looked at your code yesterday the part that seemed troublesome was:
<form ...>
<div class="input text">
<label for="...">Search for</label>
<input name=".." type="text" id="..." />
<div id="..." class=".."></div>
<div class="submit"><input type="submit" value="Search" /></div>
The highlighted div was being used to apply a border effect, but as divs are display:block, it was being drawn below the first input, and that was causing div.submit to be drawn on the next "line" so that it was below the first input - not "beside" as you described. However, that was an issue in all browsers/versions I tested, not just ie6&7, so perhaps that isn't the problem.

I just checked again and although the html hasn't changed, the second input is now floating right, and the styling removed from the div highlighted above. That means the inputs are on the left/right side of the page, even further away from each other, and the second input is still below the first.

So can you explain what you are wanting to achieve more clearly?

Global Options:
 top home search open messages active posts  

Home / Forums Index / Code, Content, and Presentation / CSS
rss feed

All trademarks and copyrights held by respective owners. Member comments are owned by the poster.
Home ¦ Free Tools ¦ Terms of Service ¦ Privacy Policy ¦ Report Problem ¦ About ¦ Library ¦ Newsletter
WebmasterWorld is a Developer Shed Community owned by Jim Boykin.
© Webmaster World 1996-2014 all rights reserved