草庐IT

hidden_size

全部标签

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/CSS : table font size different in mobile device

我想要一个既能在桌面浏览器又能在移动浏览器上运行的简单网站,但遇到了一个奇怪的(菜鸟)问题:当我有一个表格,其列文本的长度不同时,在移动设备上呈现的字体大小是截然不同。知道为什么会发生这种情况,什么是快速而干净的修复方法?预先感谢您的帮助!HTML代码:body{font-family:Verdana,Geneva,Arial,sans-serif;font-size:medium;}table,td{border:1pxsolidblack;}Shorttext.ShorttextSomelongtext.Somelongtext.Somelongtext.Somelongtext.

HTML/CSS : table font size different in mobile device

我想要一个既能在桌面浏览器又能在移动浏览器上运行的简单网站,但遇到了一个奇怪的(菜鸟)问题:当我有一个表格,其列文本的长度不同时,在移动设备上呈现的字体大小是截然不同。知道为什么会发生这种情况,什么是快速而干净的修复方法?预先感谢您的帮助!HTML代码:body{font-family:Verdana,Geneva,Arial,sans-serif;font-size:medium;}table,td{border:1pxsolidblack;}Shorttext.ShorttextSomelongtext.Somelongtext.Somelongtext.Somelongtext.

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 - Angular Material : full page tabs size

我试图占据整个页面的空间,但我似乎无法在angular-material0.10.0上获得选项卡的高度,除非我添加.ng-scope{height:100%;。有没有更好的方法实现全页标签?完整测试代码:(和here)Testvarapp_module=angular.module('app',['ngMaterial']);varapp=document.querySelector('[ng-app=app]');app_module.controller('appController',function($scope){});app_module.config(function($

html - Angular Material : full page tabs size

我试图占据整个页面的空间,但我似乎无法在angular-material0.10.0上获得选项卡的高度,除非我添加.ng-scope{height:100%;。有没有更好的方法实现全页标签?完整测试代码:(和here)Testvarapp_module=angular.module('app',['ngMaterial']);varapp=document.querySelector('[ng-app=app]');app_module.controller('appController',function($scope){});app_module.config(function($

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