Search box CSS problems -


i'm newbie. , try make search box. when open on firefox. it's okay me. in ie, chrome , safari. it's not cool actually. know problems, please me fix it?

i want make search box this: http://www.behance.net/gallery/anthracite-eikon/7171451

<div id="search-box">     <input type="text" name="search" placeholder="search..."/> </div> 

and css:

*{ margin: 0; padding: 0;  } #search-box{   background: -moz-linear-gradient(top right, #353535, #010101);   background: -webkit-linear-gradient(top right, #353535, #010101);   background: -ms-linear-gradient(top right, #353535, #010101);   background: -o-linear-gradient(top right, #353535, #010101);   background: linear-gradient(top right, #353535, #010101);   padding: 30px 0;   position: relative; }  input {   font-family: cambria, 'helvetica neue',​helvetica,​arial,​sans-serif;   font-size: 14px;   font-style: normal;   font-variant: normal;   color:  #bebebe;   font-weight: 400;   line-height: 56px;   text-shadow: 0 1px 0 rgba(0, 0, 0, 0.5) ;    border-radius: 13px;   border: 1px solid #000000;   background-clip: border-box;   padding: 5px 4px 3px 24px;   width: 94px;   height: 27px;   box-shadow: 0 0 9px #121212 inset;   position: absolute;   right: 25px;   top: 15;    background-color: #444444 ;   background-image: url('images/search_icon.png');   background-repeat: no-repeat;   background-size: 12px 12px;   background-position: 9px 8px; }  input:hover {   box-shadow: none; }  input:focus {   width: 200px;   box-shadow: none;   text-shadow: none;   color: #4d4e52;   background-color: white ;   background-image: url('images/search_icon5.png');   background-repeat: no-repeat;   background-position: 9px 8px; } 

in css input need change top:15 top:15px , change line-height 24px;

example: http://jsfiddle.net/justincook/smg3r/


Comments

Popular posts from this blog

SPSS keyboard combination alters encoding -

Add new record to the table by click on the button in Microsoft Access -

CSS3 Transition to highlight new elements created in JQuery -