HTML,CSS - 样式表单的问题

时间:2011-06-17 07:51:54

标签: html css input submit textinput

我想问你提示,如何设置我的文本输入样式并提交内联按钮,尤其是 - 我的模式看起来this

现实this

在代码中我有:

<form accept-charset="UTF-8" action="/home/index" method="post">
  <div style="margin:0;padding:0;display:inline">
    <input name="utf8" type="hidden" value="&#x2713;" />
  </div> 
  <input class="search" data-autocomplete="/home/autocomplete_produkties_nazev" id="name" name="nazev" type="text" value="" /> 
  <input src="/images/search_btn.jpg?1308243954" type="image" /> 
</form> 

在CSS中:

input.search {
    padding: 6px;
    width: 500px;
    font-size: 15px;

    border: 2px solid #cfcfcf;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;

    background-image: url('/images/xxx.png');
    background-repeat: repeat-x;
    height: 61px;
}

我正在尝试获取以及如何修复,提交按钮总是高于文本输入按钮...我不知道,哪里可能有问题...可能有人给我一些提示或提示,如何在同一行放置文本输入和提交按钮?

谢谢

1 个答案:

答案 0 :(得分:0)

您可以尝试向左移动搜索输入,向右移动提交按钮:http://jsfiddle.net/ianoxley/FEQhb/1/