<分区>
编辑问题以包含 desired behavior, a specific problem or error, and the shortest code necessary to reproduce the problem .这将有助于其他人回答问题。
关闭 6 年前。
<分区>
编辑问题以包含 desired behavior, a specific problem or error, and the shortest code necessary to reproduce the problem .这将有助于其他人回答问题。
关闭 6 年前。
我发现很多解决方案如何使行分隔符与文本居中对齐。但我需要左对齐文本。我尝试了所有解决方案,但没有成功。 我试试这段代码
<body>
<h1>ODABERITE PAKET</h1>
在CSS中
h1 {
overflow: hidden;
text-align: center;
}
h1:before,
h1:after {
background-color: #000;
content: "";
display: inline-block;
height: 15px;
position: relative;
vertical-align: middle;
width: 50%;
}
h1:before {
right: 0.5em;
margin-left: -50%;
}
h1:after {
left: 0.5em;
margin-right: -0%;
}
但这并没有像我预期的那样工作。文本在下面一行。谢谢
编辑: @Aaron Mahlke 的答案是解决方案
最佳答案
我想这样的事情会有帮助吗?
.sep{
width: 100%;
display: flex;
color: #333;
align-items: center;
flex: 1;
}
.sep:before{
content: '';
height: 1px;
background: #333;
max-width: 100px;
margin-right: 10px;
flex: 1;
}
.sep:after{
content: '';
height: 1px;
background: #333;
flex: 1;
margin-left: 10px;
}
<div class="sep">
<p>Text</p>
</div>
关于html - 行分隔符,但带有 float text-left,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/39870371/