html - 按钮和文本框的CSS

Question

我想在布局中显示右侧的按钮和文本框。但现在我得到了这个链接。

   .search,
   .add {
     float: right;
     margin-left: 9px;
   }
   .sxt {
     float: right;
   }

<input class="stxt" type="text" name="searchtxt">
<a style="padding-right:2ex;"></a>
<button name="search" class="search">Search</button>

Answer 1

在你的 css 中做一些更改并像下面的代码一样更新它

 .search,.add{
 float: left;
margin-left: 9px;
background: #85BD02;
border: 0;
padding: 5px 10px;
border-radius: 5px;
color: white;
}

.sxt{
float: right;
}  

<div style="width: 50%;margin: auto;">
<input class="stxt" type="text" name="searchtxt">
<a style="padding-right:2ex;"></a><button name="search" class="search">Search</button>
    </div>

检查 jsfiddle:http://jsfiddle.net/2essewv0/2/