html - 单个 不会创建换行符，而是需要两个

Question

我正在开发一个 Wordpress 主题，并且一直在使用 Bootstrap。我把我的主页文章摘录放在井里，div class='well' .我已将井编辑为直 Angular 并更改了边框颜色。除了那些，没有任何变化。但是，当我尝试在类别和标签之间添加换行符时，它不会像下图那样 float 到最左边。

Q1。如何使用单<br />在两者之间换行？Q2。类别和标签后的井中有很多空白区域。如何删除它？

HTML代码

<div class="categories"><?php the_category(' '); ?></div><br /><br /><div class="tags"><?php the_tags('',' '); ?></div>

CSS

.categories{float:left; margin-right:3px;margin-bottom: 1px;}
.categories a {
background: #00A1E0;
color: #FFFFFF;
display: inline-block;
margin-bottom: 2px;
margin-left: 0px;
padding: 1px 7px;
text-decoration: none;
transition: all 0.3s ease 0s;
} 
.categories a:hover{background:  #666; color:#fff;}

.tags{float:left; margin-right:1%;margin-bottom:4px;}
.tags a {
font-size:70%;
background:#666666;
color: #FFFFFF;
display: inline-block;
margin-bottom: 3px;
margin-left: 0px;
padding: 1px 7px;
text-decoration: none;
transition: all 0.3s ease 0s;
} 
.tags a:hover{color:#FFFFFF;}

当我使用单个 <br /> , 这就是发生的事情 http://i.stack.imgur.com/OIDYt.png (抱歉，由于缺少代表，无法发布图片)。

Answer 1

尝试移除 float 样式。仅使用显示:内联 block 。或者使用 clear: both 作为 div 之后的第一个标签。