假设我有一个未知固定宽度的外部容器和一个内部元素,如下所示:
<div id="outer"><div id="inner">hide me when #outer is too small</div></div>
解决方法
这是不可能通过纯CSS,因为你不能提供条件(如果你不使用IE .htc文件;)).您需要使用JS并比较两个元素的宽度.
对于文本,您可以使用:text-overflow:clip | ellispis;
编辑:
#inner { width: 100%; overflow: hidden; text-overflow: ellipsis; }
可能会有所帮助.
编辑:
我是prepared a fiddle for rampion的解决方案.请注意,带有自定义字符串的文本溢出仅适用于FF.此外,文本溢出尚未标准化. W3C目前在its working draft中将其称为文本溢出模式.另请参见interesting article at MDN.