我正在尝试构建一个可以动态添加条件的搜索。
我正在使用 Bootstrap,这是它目前的样子(HTML 渲染)
问题是我希望加号和减号链接显示在每行条件的末尾,如下所示:
我的代码:
a.addremove{
display:block;
background-color: #4B5E75;
color: #fff;
margin: 0;
width: 32px;
height: 32px;
font-size:16px;
text-align: center;
line-height: 38px;
border-radius: 50%;
}
<form class="span10 offset1 custom-form">
<div class="control-group">
<div class="controls">
<select class="field">
<!-- <option disabled selected>Choose a Field</option>-->
<option value="title">Title</option>
<option value="lo">Learning Objectives</option>
<option value="unit">Unit</option>
<option value="cal_year">Calendar Year</option>
<option value="year">Year</option>
<option value="theme">Theme</option>
<option value="type">Type</option>
<option value="person">Person</option>
</select>
<select>
<option value="contains">Is</option>
<option value="lo">Is Not</option>
<option value="Includes">Includes</option>
<option value="Excludes">Excludes</option>
</select>
<span class="value">
<input type="text" placeholder="Keyword">
</span>
<a class="ss-icon addremove add">add</a>
</div>
<div class="control-group">
<div class="controls">
........
在保留我为这些链接进行的 block 级循环样式的同时实现该目标的最佳方法是什么?
最佳答案
代替 display: block;
使用 display: inline-block;
关于html - 将 block 元素放置为与表单元素内联的链接,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/17824467/