当我全屏查看页面时,我有以下标记可以正常工作
,但是当我减小浏览器的宽度时,它会溢出div.
我已经使用了白色空间:面板上的正常但它不起作用. text-overflow:省略号也没有做任何事情.我正在使用Bootstrap.
<div class="col-sm-4"> <section class="panel" style="background:#e74c3c; color:#FFF;"> <div class="panel-body"> COMPLAINT<br> 8 </div> </section> </div>
.col-sm-4 { width: 33.33333333333333%; } .panel-body { padding: 15px; } .panel { margin-bottom: 15px; background-color: #ffffff; border: 1px solid transparent; border-radius: 4px; -webkit-Box-shadow: 0 1px 1px rgba(0,0.05); Box-shadow: 0 1px 1px rgba(0,0.05); }
解决方法
对于文本溢出:要使用省略号,您必须为该元素添加overflow:hidden设置.
.panel-body { text-overflow: ellipsis; overflow: hidden; }
原文地址:https://www.jb51.cc/html/223897.html
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。