입력 텍스트와 제출 버튼을 같은 줄에 표시

Question

입력 텍스트 필드와 sumit 버튼을 같은 줄에 넣어야합니다. 나는 많은 것을 시도했지만 아무 일도 없었다.

형태 :

<%= form_tag("/recherche", :method => "get") do %> 
    <%= search_field_tag :recherche, params[:recherche] %> 
    <%= submit_tag "Recherche", :name => nil, :id => "submit"%> 
<% end %> 

생산 :

<form accept-charset="UTF-8" action="/recherche" method="get"><div style="margin:0;padding:0;display:inline"><input name="utf8" type="hidden" value="&#x2713;" /></div> 
    <input id="recherche" name="recherche" type="search" /> 
    <input id="submit" type="submit" value="Recherche" /> 
</form> 

내가

참고로 등, 내가 플로트, 디스플레이 시도 ... 사용하는 것을 CSS 아무 생각이 없다, 양식은 <li>에 싸여 있습니다. 나는 그들이 같은 줄에 이미 생각

Answer 1

의견에서 jQuery Mobile을 사용하고 있다고 덧붙입니다. 이것은 문제의 원인 인 것으로 보이므로 명백한 해결책은 사용을 중단하는 것입니다. 그러나 어떤 이유로 든 필요한 경우 폼 필드 너비에 어떤 영향을 미치는지 확인하십시오. input 요소의 넓이는 얼마입니까? 크기를 작게 설정해야 할 수도 있습니다.

<style> 
#recherche { width: 15em; } 
</style> 

Answer 2

는, 참조 : 당신은 당신의 input 태그에 display: inline 또는 display: inline-block를 추가해야

http://jsfiddle.net/hhzFd/

Answer 3

. 가장 간단한 방법은, 당신이 그것을 수정해야 할 수 있습니다 이것은 모든 입력에 inline을 적용합니다

input { 
    display: inline; 
} 

이 CSS 스타일을 추가하는 것입니다.