• Sign in to Neowin Faster!

    Create an account on Neowin to contribute and support the site.

  • 0
Sign in to follow this  

Need help with CSS - alignment issue

Question

wrack    455

Hi,

 

I have got a site http://hagglehive.com/ and on the top there is a search box.

 

In IE10+ and Firefox all is well. See below.

 

post-190274-0-73814800-1415654271.png

 

In Chrome and Safari the search textbox is out of alignment. See below. I have tried many things but not sure what to do?

 

post-190274-0-25936500-1415654321.png

 

Any ideas, suggestions are welcome :)

Thanks.

Share this post


Link to post
Share on other sites

5 answers to this question

Recommended Posts

  • 0
Seahorsepip    610
.SearchBox {
    float: left;
}

Floats are magic  :shiftyninja:

  • Like 1

Share this post


Link to post
Share on other sites
  • 0
spacer    988

Have you tried explicitly setting the line-height property of the search box container? For instance, if the container is 100px high, you can set the line-height to 100px, and that typically centers inline items; all things being equal.

 

You may also get better responses if you give us examples of the DOM and styles already in place, and what you've tried already that didn't work.

Share this post


Link to post
Share on other sites
  • 0
+Zlip792    483

Worthwhile read, I recommend you read and try given trick on it:

 

http://css-tricks.com/webkit-html5-search-inputs/

 

Below code do fix it but with little trade of alignment in IE with in front of text but only sharp eye can catch it IMO.

Try this:

input[type=text] 
{
line-height: 3em;
} 

Share this post


Link to post
Share on other sites
  • 0
+Zlip792    483
.SearchBox {
    float: left;
}

Floats are magic  :shiftyninja:

 

 

Bang Bang boy!!! Rocked!!!

  • Like 1

Share this post


Link to post
Share on other sites
  • 0
wrack    455
.SearchBox {
    float: left;
}

Floats are magic  :shiftyninja:

 

Darn diddly. I swear tried that too! Guess I was not trying enough. Thanks man.

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
Sign in to follow this  

  • Recently Browsing   0 members

    No registered users viewing this page.