将元素添加到非包装容器，在左侧溢出

Question

我需要使用JS向容器中添加元素。当内部元素的总宽度大于包裹DIV的宽度时，最左边的元素应该消失到左侧。

我以为我可以通过

获得所需的效果

p {
    border: 1px solid red;
    display: inline-block;
    float: left;
    margin: 1px;
    padding: 0;
    white-space: nowrap;
}

但它不起作用，因为元素浮动到下一行。

小提琴：http://jsfiddle.net/RqU3E/2/

感谢任何建议！

Answer 1

this solution怎么办？

您需要使用具有固定宽度/高度的元素和overflow：hidden：

来包装容器

width: 200px;
height: 23px;
overflow: hidden;
position: relative;

只要容器的宽度大于包装器的宽度，就将容器对齐到此包装器的右侧（通过JS）：

position: absolute;
right: 0px;

Answer 2

这是solution。

对CSS的更改：

.container{display:table;}

希望这有帮助。