草庐IT

hidden-xs

全部标签

html - border radius + overflow hidden + inner element (progress bar) 使锯齿状边缘伪影

我正在尝试构建一个进度条,非常简单。我有一个嵌套在托盘内的酒吧。托盘上设置了overflow:hidden和border-radius。这是jsFiddle证明问题。如您在图片中所见,进度条左侧有一个锯齿状的瑕疵。父级进度条(深色背景)的抗锯齿边缘似乎在流血出去。所需的行为是bar/fill元素用于消除进度条的锯齿。我尝试过的一个简短的解决方案是绝对定位内部div,但是进度条需要能够从0%到1%进行动画处理,并且看起来没有overflow:hidden剪辑。我在Chrome和Firefox看到了这个工件,所以我不会立即怀疑它是Webkit中的错误。我还注意到这个错误也会影响Bootst

html - border radius + overflow hidden + inner element (progress bar) 使锯齿状边缘伪影

我正在尝试构建一个进度条,非常简单。我有一个嵌套在托盘内的酒吧。托盘上设置了overflow:hidden和border-radius。这是jsFiddle证明问题。如您在图片中所见,进度条左侧有一个锯齿状的瑕疵。父级进度条(深色背景)的抗锯齿边缘似乎在流血出去。所需的行为是bar/fill元素用于消除进度条的锯齿。我尝试过的一个简短的解决方案是绝对定位内部div,但是进度条需要能够从0%到1%进行动画处理,并且看起来没有overflow:hidden剪辑。我在Chrome和Firefox看到了这个工件,所以我不会立即怀疑它是Webkit中的错误。我还注意到这个错误也会影响Bootst

html - 像素错误溢出 : hidden and transform: translate

我有一个带标题的框,它是position:absolute并用top:100%隐藏。标题的父级有overflow:hidden。当我将鼠标悬停在框上时,标题会向上滑动,因此完全可见。现在的问题是,在此转换期间,存在像素错误。这意味着过渡期间的标题比父框宽1个像素。转换后一切看起来都很好。它出现在Windows8.1的IE11和Mac10.11.2的Webkit浏览器中。您应该在thisfiddle中看到此效果.当您没有看到像素错误时,请尝试调整窗口大小。您还会在屏幕截图中看到错误。我已经尝试过:将标题设置为宽1个像素添加overflow-x:hidden添加translate3d

html - 像素错误溢出 : hidden and transform: translate

我有一个带标题的框,它是position:absolute并用top:100%隐藏。标题的父级有overflow:hidden。当我将鼠标悬停在框上时,标题会向上滑动,因此完全可见。现在的问题是,在此转换期间,存在像素错误。这意味着过渡期间的标题比父框宽1个像素。转换后一切看起来都很好。它出现在Windows8.1的IE11和Mac10.11.2的Webkit浏览器中。您应该在thisfiddle中看到此效果.当您没有看到像素错误时,请尝试调整窗口大小。您还会在屏幕截图中看到错误。我已经尝试过:将标题设置为宽1个像素添加overflow-x:hidden添加translate3d

html - IE10 : 'visibility:visible' on before pseudo-element of 'visibility:hidden' element

我制作了一个DIV和visibility:hidden并附加了一个::before这个DIV的伪元素visibility:可见。这在Firefox、Chrome和Safari中按预期工作,但在InternetExplorer10中不呈现伪元素。请解释我是否做错了,或者这是否是InternetExplorer的问题。是否有任何解决方法(我们只能访问CSS,而不能访问源HTML)?JSFiddledemonstratingissue. 最佳答案 过滤器不适用于IE中的伪元素。读:msdnOtherspecifiedstylingprop

html - IE10 : 'visibility:visible' on before pseudo-element of 'visibility:hidden' element

我制作了一个DIV和visibility:hidden并附加了一个::before这个DIV的伪元素visibility:可见。这在Firefox、Chrome和Safari中按预期工作,但在InternetExplorer10中不呈现伪元素。请解释我是否做错了,或者这是否是InternetExplorer的问题。是否有任何解决方法(我们只能访问CSS,而不能访问源HTML)?JSFiddledemonstratingissue. 最佳答案 过滤器不适用于IE中的伪元素。读:msdnOtherspecifiedstylingprop

html - IE9 float 溢出 :Hidden and Table Width 100% Not Displaying Properly

我试图在页面右侧float一个容器。它的左边是很多我需要100%宽度的表格。我希望它们一直延伸到右侧的float元素。当右侧的元素结束时,我希望表格延伸到页面末尾。这在除IE之外的所有浏览器中都适用。在IE中,所有表格都显示在右侧float元素的下方。我知道IE中隐藏了溢出的解决方法,但我无法让它工作。下面的代码。.container{margin:0auto;min-width:1000px;max-width:1200px;}.sidebar{float:right;width:300px;margin-left:5px;}.tholder{overflow:hidden;}Tex

html - IE9 float 溢出 :Hidden and Table Width 100% Not Displaying Properly

我试图在页面右侧float一个容器。它的左边是很多我需要100%宽度的表格。我希望它们一直延伸到右侧的float元素。当右侧的元素结束时,我希望表格延伸到页面末尾。这在除IE之外的所有浏览器中都适用。在IE中,所有表格都显示在右侧float元素的下方。我知道IE中隐藏了溢出的解决方法,但我无法让它工作。下面的代码。.container{margin:0auto;min-width:1000px;max-width:1200px;}.sidebar{float:right;width:300px;margin-left:5px;}.tholder{overflow:hidden;}Tex

html - 覆盖溢出 :hidden with z-index

我正在使用coda_bubblejquery插件,我需要让我的气泡在溢出隐藏的div中弹出。这是我的示例代码。Overrideoverflow:hidden$(function(){opts={distances:[40,40],leftShifts:[0,0],bubbleTimes:[400,400],hideDelays:[0,0],bubbleWidths:[200,200],bubbleImagesPath:"YOURRELATIVEPATHTOSKINFOLDER",msieFix:true};$('.coda_bubble').codaBubble(opts);});bo

html - 覆盖溢出 :hidden with z-index

我正在使用coda_bubblejquery插件,我需要让我的气泡在溢出隐藏的div中弹出。这是我的示例代码。Overrideoverflow:hidden$(function(){opts={distances:[40,40],leftShifts:[0,0],bubbleTimes:[400,400],hideDelays:[0,0],bubbleWidths:[200,200],bubbleImagesPath:"YOURRELATIVEPATHTOSKINFOLDER",msieFix:true};$('.coda_bubble').codaBubble(opts);});bo