在AdminLTE主题栏标题菜单标题在标题很长时没有正确显示,它会打破该行并在图标下方显示文字。 我希望它从第一行的第一个字母开始 我已附上截图 在图像中,“consetetur”应该从“Lorem”这个词的正下方开始。
这是我的代码:
<li class="treeview">
<a href="#">
<i class="fa fa-circle-o"></i>
<span style="padding-right: 50px;white-space: normal;line-height:14px">
Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod
</span>
<span class="pull-right-container">
<i class="fa fa-angle-left pull-right"></i>
</span>
</a>
<ul class="treeview-menu" style="display: none;">
<li>
<a href="#">
<div style="width:100%;display:inline-block">
<div style="width:10%;float:left;padding-top: 5px;">
<i class=" fa fa-arrow-circle-right"></i>
</div>
<div style="width:90%;float:right">
Lorem ipsum dolor
</div>
</div>
</a>
</li>
<li>
<a href="#">
<div style="width:100%;display:inline-block">
<div style="width:10%;float:left;padding-top: 5px;">
<i class=" fa fa-arrow-circle-right"></i>
</div>
<div style="width:90%;float:right">
Lorem ipsum dolor
</div>
</div>
</a>
</li>
</ul>
使用
a { display: table} a>* { display: table-cell;}
显示
文字应该从图标旁边开始
感谢。
答案 0 :(得分:0)
<强>更新强>
a {
display: table
}
a>* {
display: table-cell;
}
&#13;
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<a href="#">
<i class="fa fa-car"></i>
<span >
Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod Lorem ipsum dolor sitLorem ipsum dolor sit Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod Lorem ipsum dolor sitLorem ipsum dolor sit
</span>
</a>
&#13;
答案 1 :(得分:0)
我在@ amit77309的帮助下得到了解决方案。
需要添加以下样式:
.treeview > a { display: table}
.treeview > a > *{ display: table-cell;}
感谢。