html - Search button out of div -
here example of problem. can see clickable search button places litle bit higher search field.
html
<div class="search_menu"> <%= form_tag search_index_path, :method => 'get' %> <%= text_field_tag :search, params[:search], :placeholder=> (i18n.t 'placeholder') %> <%= image_submit_tag ('search_button_main.png'),:title=> (i18n.t 'search_now') %> <%end%> </div>
css
.search_menu { display:block; float:right; width:200px; height:30px; }
i tried
position:relative; top:10px;
for either search field or button still every time search button in air. cause kind of problem?
there few ways align input field image. here 1 of easiest method giving vertical-align:bottom
image.
.search_menu img{vertical-align:bottom; display:block;}
update:
after seeing code clear instead of image input type=image
in used. i've changed code little bit. check latest demo.
.search_menu input[type="image"]{vertical-align:bottom; display:inline-block;}
Comments
Post a Comment