如何将按钮移动到文本区旁边

-2

搜索框包含一个输入标签和一个标签。它看起来像下面的图片。我想将按钮右侧的textarea像第二个图像一样移动。我尝试了“浮动”，但它没有奏效。有人能帮我弄清楚吗？如何将按钮移动到文本区旁边

<div class="search"> 
 
     <input type="text" placeholder="Search here..." class="validate"> 
 
     <a class="waves-effect waves-light btn">Search</a> 
 
    </div>

actual output

desired output

来源

2016-02-28 jzhangnu

包括完整的CSS代码或使一个JSFiddle – jetlej

我想，浮动因为特殊性而不起作用。检查devtools中的元素，看看CSS是如何应用的，以及你的float是否被覆盖... – Aziz

没有你的CSS，没有办法帮助你，而不仅仅是为你完成整个工作:) –

柔性可能仍然是一个选项：

.search { 
 
    display:flex; 
 
    margin:50px 1em 1em; 
 
    } 
 
input { 
 
    flex:1; 
 
    } 
 
a { 
 
    padding:1em; 
 
    background:tomato;

<div class="search"> 
 
     <input type="text" placeholder="Search here..." class="validate"> 
 
     <a class="waves-effect waves-light btn">Search</a> 
 
    </div> 
 
                           <br/><br/><br/><br/><br/><br/><a href="http://codepen.io/gcyrillus/pen/jqOdMg">demo</a>

来源

2016-02-28 21:05:34

如何将按钮移动到文本区旁边

回答

相关问题