css 如何把标题的第二行放在第一行的正下方[重复]

ztmd8pv5  于 2023-01-14  发布在  其他
关注(0)|答案(1)|浏览(145)
    • 此问题在此处已有答案**:

Li item on two lines. Second line has no margin(8个答案)
昨天关门了。
我把图标和标题放在一起。当标题太长时,第二行从图标下而不是标题下开始。当标题太长并且必须在第一个字母下而不是图标下时,我需要帮助。

<div className="notAcceptingPatients col-med-6"\>
<h6 className="font-weight-bold text-dark "\>
<i
style={{
color: '#D14444',
fontSize: 23,
marginRight: 6,
}}
class="fa fa-info-circle"\>\</i\>

This Dental Clinic is not accepting new patients at
this time \</h6\>
<p className="notAcceptingPatients ml-2"\>
<p\>
the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.\</p\>
</p\>
</div\>
CSS
.notAcceptingPatients {
 padding: 11px ;
 background: rgba(219, 88, 88, 0.1);
 border-radius: 8px;

p {
margin: 2px;
font-size: 15px;
color: $black;
background: none;
line-height: 19px;
font-weight: 400;
padding: 1px 0px;
    }
}
z9smfwbn

z9smfwbn1#

对于标题,您可能希望使用flex positioning来设置其样式。

<h6 style={{ display: 'flex' alignItems: 'center' }}>
  <i style={{ color: '#D14444', fontSize: 23, marginRight: 6, }} class="fa fa-info-circle"></i>
  This Dental Clinic is not accepting new patients at this time
</h6>

相关问题