html - 我怎样才能强制溢出: hidden to not use up my padding-right space

Question

我有以下代码:

<div style="width: 100px; 
overflow: hidden; 
border: 1px solid red; 
background-color: #c0c0c0;
padding-right: 20px;
">
2222222222222222222222111111111111111111111111113333333333333333333</div>

(XHTML 1.0 过渡)

发生的情况是 padding-right 没有出现，它被内容占用了，这意味着溢出用完了 padding right 空间并且只在 padding 之后“切断”。

有没有办法强制浏览器在 padding-right 之前溢出，这意味着我的 div 将显示 padding right？

我得到的是下图中的第一个div，我想要的是类似第二个div的东西:

image

Answer 1

我对溢出有同样的问题:隐藏；遵守所有填充规则，除了右侧。此解决方案适用于支持独立不透明度的浏览器。

我刚刚更改了我的 CSS:

padding: 20px;
overflow: hidden;

到

padding: 20px 0 20px 20px;
border-right: solid 20px rgba(0, 0, 0, 0);

使用容器 div 效果很好，但这实际上会使页面上的 div 数量翻倍，感觉没有必要。

不幸的是，在你的情况下这不会很好地工作，因为你需要在 div 上有一个真正的边框。