在 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;}
显示
文字应该紧挨着图标开始
谢谢。
最佳答案
已更新
- 检查您的浏览器兼容性。对我来说,它在 chrome 中工作。
- 在不使用任何额外的 html 或 css 的情况下检查这一小部分。
- 检查您的 CSS 是否覆盖了此样式。
a {
display: table
}
a>* {
display: table-cell;
}
<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>
关于html - 边栏菜单标题在 AdminLte 中未正确显示,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/49750474/