草庐IT

overflow-dropdown

全部标签

html - overflow hidden ,但仍然可以滚动(仅限 Chrome)

我有一个非常奇怪的CSS“错误”。我目前正在研究slider(幻灯片上有表单元素)。当我在幻灯片中的标签上单击并拖动(向右水平滚动)时,容器滚动并且下一张幻灯片可见,而属性overflow:hidden;设置在容器上。我发现当没有label标签时,overflow属性工作正常。有人对此有解决方案吗?我尝试了很多CSS的东西但没有成功。我在这里重新创建了JsFiddle中的错误:clicky更新点击和拖动错误仅出现在Chrome中。(我测试了IE和FF)另外,不是关于带有标签的ul列表的滚动条,而是关于你可以点击一个标签并将其拖动到右侧以滚动到下一张幻灯片。

html - 为什么 overflow hidden 会影响高度,在此示例中我该如何解决?

fiddle:https://jsfiddle.net/wa51kdh7/代码:HTML:HelloWorldGoodbyecruelworldCSS:span{display:inline-block;margin:0;padding:0;line-height:16px;font-size:16px;height:16px;}.span1{background-color:lightblue;}.span2{background-color:pink;overflow:hidden;width:130px;text-overflow:ellipsis;}在这里,我试图创建两个彼此相

html - 在 HTML 中 overflow hidden 文本的中间

是否有可能overflowhidden文本的中间而不是结尾?例如用句点替换溢出的文本。我现在专门在表格中谈论,但最好知道任何可能的方式。所以我的意思是将112233445566778899缩短为112...899(或类似的东西)而不是11223344我对JavaScript了解不多,但如果这是唯一的方法,请告诉我如何操作,我会通过教程解决其余问题。 最佳答案 我提出了一个纯JavaScript解决方案,它结合了NickR's和alhoseany's一起回答,同时添加一些额外的功能来检测长度并指定省略号两侧所需的字符数。使用此方法,您

javascript - 使 'dropdown-content' 与 paper-dropdown-menu 的宽度相同?

我有以下代码:InboxStarredSentmailDrafts但如下图所示,dropdown-content的宽度非常小。我怎样才能以一种干净的方式将宽度设置为与实际paper-dropdown-menu相同的大小? 最佳答案 我相信我已经在这个jsfiddle中创造了您想要的东西.或者如果你喜欢这里是代码片段.custom{width:190px;}.custom2{width:400px;}JSBinInboxStarredSentmailDraftsInboxStarredSentmailDraftsHTMLImports

html - 设置 overflow-y 也会导致 overflow-x 发生变化

这个问题在这里已经有了答案:CSSoverflow-x:visible;andoverflow-y:hidden;causingscrollbarissue(9个回答)关闭6年前。当我在block上设置overflow-y时,它似乎影响了overflow-x属性。我做了一个JSFiddlewithanexampleofthisproblem.它似乎在所有浏览器中都在发生,所以我想我遗漏了一些显而易见的东西。我有两个不重叠的block(蓝色和绿色)以及第三个block(红色),具有以下要求:蓝色和红色block相邻红色block包含在蓝色block中,但与绿色block重叠蓝色block

html - CSS: make overflow-x: hidden 真的隐藏了吗?

我有一个使用overflow-x:hidden设置样式的div,但我发现当其中包含文本的更宽的div时,用户仍然可以使用鼠标查看隐藏文本。我想阻止这种情况并使文本真正隐藏起来。这个jsfiddle应该显示我的意思:http://jsfiddle.net/YzsGF/11/或者这里是代码:HowcanItrulyhidethetextbeyondthemargin?#outer{width:150px;height:300px;overflow-x:hidden;border:1pxsolidblack;}#inner{width:300px;overflow-x:hidden;}有什么

html - 使用 Flexbox 和 Overflow 使元素居中

问题总结我想要的布局是能够在页面上将未知大小的图像居中(垂直和水平)。如果图像太大而不适合任何一个方向,我想显示滚动条以便用户可以滚动查看完整图像。我遇到的问题是,当图像太大而放不下时,图像的顶部和左侧(取决于被截掉的部分)将永远无法滚动到。尝试的解决方案我正在尝试使用flexbox来实现所需的布局,但flexbox不是必需的。这是一个重现问题的小示例(请注意,我没有在CSS中放置任何浏览器前缀,因此您需要在Chrome[或者Firefox,也可以?]中查看它):.body{height:600px;}.container{margin:auto;display:flex;align-

html - 使用 overflow-x : auto;"时,有没有办法在我的表格和滚动条之间放置一个空格

我有一个像这样的简单表格:......#table-overflow{position:absolute;top:10rem;right:3rem;left:3rem;bottom:2rem;display:block;overflow-x:auto;}当有很多行和列时,滚动条会按预期出现。当宽度大于表格时,我会在右侧看到一个垂直滚动条,表格数据会一直上升到该滚动条。有什么方法可以在不使用jQuery滚动条插件的情况下在垂直滚动条左侧和水平滚动条上方留出空间吗?我想看到的是这样的:xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxvx

html - pos :relative & overflow-y:scroll 内的固定位置 div

我希望在带有overflow-y:scroll的div中有一个固定位置的div,这意味着我希望div保持原位,而其余内容正常滚动。而且我不知道出了什么问题,有人可以帮忙吗?提前致谢....foo{position:relative;display:block;width:100%;height:300px;overflow-y:scroll;}.bar{position:fixed;top:0;right:0;}这是HTML............ 最佳答案 当您将position:fixed应用于元素时,您是在相对于窗口本身而不是

jquery - 如何在表单中实现类似 Stack Overflow 的水印?

我记得在某个地方看到过一个教程,它讨论了如何以更“可用”的方式设置输入表单的样式。本质上,您有一个占位符值,当您输入时,它可以说隐藏了提示。现在,明确一点:我不希望提示(占位符值文本)在聚焦时消失,而是希望在我第一次开始输入内容时变得更轻。很好的例子:查看Aardvark上的表格.这正是我希望输入表单的方式。我们自己的StackOverflow—当您尝试提出问题时,在任何输入表单内单击时,它不会立即隐藏文本。您会看到光标和提示。但是当您开始输入时,它会隐藏提示。(不过,我宁愿让它变成更浅的阴影,也不愿像上面的Aardvark示例那样将它们全部隐藏在一起。)我记得非常清楚地在interw