Html 在 div 后添加或强制换行
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/29073573/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Adding or Forcing Line Break after div
提问by Tunde Pizzle
I have a divthat hold some anchor tags as shown below. And also a <hr>tag to segment my page. however even using the div as a blockelement wouldn't force the <hr>element to start on a new line rather it aligns the <hr>next to the div.
我有一个div包含一些锚标签的标签，如下所示。还有一个<hr>标签来分割我的页面。然而，即使将 div 用作块元素也不会强制该<hr>元素从新行开始，而是将其与<hr>div的下一个对齐。
how can i resolve this?
我该如何解决这个问题？
<div id="inner">
<div id="headerBlock">
<a href='.actorgroup' id='346' onclick='return displayactorgroupFunc(this.id);'>Actor2</a>
<span class='rowNumber2'> | </span>
<a href='.actorgroup' id='15201' onclick='return displayactorgroupFunc(this.id);'>Actor1</a>
</div>
</div><hr/>
Css:
css：
#headerBlock{
display: block;
}
#inner {
padding:10px;
display:block;
float: left;
}
#inner a{
display:inline-block;
padding-left:20px;
line-height:20px;
color:#808000;
font-size:14px;
text-decoration: none;
}
回答by Math3w
回答by Bikas
Find below the solution with HTML (CSS will remain same). I've modified code for brevity.
在下面找到 HTML 的解决方案（CSS 将保持不变）。为简洁起见，我修改了代码。
<div id="inner">
<div id="headerBlock">
<a>Actor2</a>
<span class='rowNumber2'> | </span>
<a>Actor1</a>
</div>
</div>
<hr style="clear:both;">
回答by stanze
Add this style
添加此样式
.rowNumber2{
display : block;
}
回答by Chris Werner
None of this helped. For my purpose it was as simple as adding.
这些都没有帮助。为了我的目的，它就像添加一样简单。
page-break-inside: avoid;
This tells the browser to treat the div/object it's applied to as a single object that shouldn't split across multiple pages.
这告诉浏览器将其应用的 div/对象视为不应拆分到多个页面的单个对象。
