如何溢出文本而不是在元素中换行

How to overflow texts instead of wrap in an element?

本文关键字:元素 换行 文本 何溢出 溢出      更新时间:2023-09-26

我正在调整div元素的宽度,但<li>内容内部包装宽度调整,不溢出。我希望文本不换行,而是在宽度变小时溢出。

是否有这样设置内容行为的属性?

这是我的CSS:
.contactPanel{ //the div container
    z-index: 2;
    left: 660px;
    top: -650px; 
    position: relative;
    width: 0px;
    padding-left: 10px;
    overflow: hidden;
}
.contactPanel ul{ 
    margin: 0; 
    padding: 0px;
    list-style: none; 
    overflow: hidden;
}

你需要嵌套一个div:

<div class="wrapper">
    <div class="inner">
        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam non lacinia quam. Etiam neque elit, ullamcorper vel consectetur quis, tristique et elit. Proin facilisis purus ut velit dapibus luctus. Sed semper vestibulum metus, id adipiscing lectus malesuada in. Mauris vel turpis sem, eu suscipit arcu. Sed faucibus laoreet nisi, at elementum justo eleifend ut. In hac habitasse platea dictumst. Nunc nec ligula nibh, a varius massa.
    </div>
</div> 
css:

.wrapper {
    width:400px;
    border:1px solid #ff0000;
    overflow:hidden
}
.inner {
    width:500px;
    border:1px solid #0000ff
}