html - 使文本隐藏在容器边界之外

标签 html css sass

<分区>

我在一个方形容器内添加了文本,我试图让超出边界的字母部分消失,因此它只显示边界内的内容。我无法让它工作。我尝试 overflow hidden ,但没有做任何事情。 Rw 是我只需要隐藏在通过边界的字母部分的文本

我正在使用 SASS,所以这就是变量的原因。

这是html

<div class="container">
<div class="itemsection clearfix">
        <div class="item"><h1>Rw</h1></div>
        <div class="item"></div>

这是CSS

.item {
        float: left;
        margin: 0 0 70px 6.04%;
        height: $itemsize;
        width: $itemsize;
        background-color: #ddd;
        border: 8px solid #fff;
        box-shadow: 0 0 20px 0px #ddd;
        overflow: hidden;

        h1 {
            font-size: 7em;
            margin: 15px 0 0 -28px;
        }
    }

最佳答案

我让它工作了。出于某种原因,罗盘不会刷新样式表,当它最终完成时,它完美地切割了它

关于html - 使文本隐藏在容器边界之外,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/17203831/

相关文章:

javascript - 具有可变路径的 Webpack 和 Bootstrap

javascript - "Menu"到 "Close"文本转换

javascript - 使用 Fabric JS 设置线条对象的渐变

html - 使用 css 和 flexbox 的带有滚动按钮​​的可滚动 html 面板

symfony - Assetic 和我的 Assets

ruby - Sass: errno::enoent: 没有那个文件或目录

html - 跳过下划线计数器

html - 对齐表格单元格底部的按钮

css - 向 ion-select 添加自定义样式

javascript - 如何延迟每个元素的 jQuery Waypoint 以产生惊人的效果?