blocks|key|162970|text|我认为您只需将溢出属性保留为可见，只需使用填充左和右。除非你有图像，否则文字应该被包装起来。|type|unstyled|depth|inlineStyleRanges|entityRanges|data|162971|对于图像，您应该考虑使用宽度为100%25的儿童div。|162972|entityMap^0|0|0^^$0|@$1|2|3|4|5|6|7|F|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|G|8|@]|9|@]|A|$]]|$1|D|3|-4|5|6|7|H|8|@]|9|@]|A|$]]]|E|$]]

I would think you can just leave the overflow property to visible and just use padding left and right.
Unless you have images, the text should just get wrapped.

For images, you should look at using children divs with width:100%

blocks|key|4197189|text|你能试试一些jQuery滚动插件吗？|type|unstyled|depth|inlineStyleRanges|offset|length|style|BOLD|entityRanges|data|4197190|scrollbar.html|4197191|http://baijs.nl/tinyscrollbar/|4197192|http://www.net-kit.com/jquery-custom-scrollbar-plugins/|4197193|entityMap|0|LINK|mutability|MUTABLE|url|http://manos.malihu.gr/tuts/jquery_custom_scrollbar.html|1|2^0|6|A|0|0|E|0|0|0|U|1|0|0|1J|2|0^^$0|@$1|2|3|4|5|6|7|V|8|@$9|W|A|X|B|C]]|D|@]|E|$]]|$1|F|3|G|5|6|7|Y|8|@]|D|@$9|Z|A|10|1|11]]|E|$]]|$1|H|3|I|5|6|7|12|8|@]|D|@$9|13|A|14|1|15]]|E|$]]|$1|J|3|K|5|6|7|16|8|@]|D|@$9|17|A|18|1|19]]|E|$]]|$1|L|3|-4|5|6|7|1A|8|@]|D|@]|E|$]]]|M|$N|$5|O|P|Q|E|$R|S]]|T|$5|O|P|Q|E|$R|I]]|U|$5|O|P|Q|E|$R|K]]]]

Can you try some jQuery scroll plugins for this?

<a href="http://manos.malihu.gr/tuts/jquery_custom_scrollbar.html" rel="nofollow">http://manos.malihu.gr/tuts/jquery_custom_scrollbar.html</a>

<a href="http://baijs.nl/tinyscrollbar/" rel="nofollow">http://baijs.nl/tinyscrollbar/</a>

<a href="http://www.net-kit.com/jquery-custom-scrollbar-plugins/" rel="nofollow">http://www.net-kit.com/jquery-custom-scrollbar-plugins/</a>

blocks|key|4197224|text|尝试jquery选择框插件，它很棒，并且完全按照您想做的做：|type|unstyled|depth|inlineStyleRanges|entityRanges|data|4197225|http://jquery-ui.googlecode.com/svn/branches/labs/selectmenu/index.html|offset|length|4197226|entityMap|0|LINK|mutability|MUTABLE|url^0|0|0|1Z|0|0^^$0|@$1|2|3|4|5|6|7|M|8|@]|9|@]|A|$]]|$1|B|3|C|5|6|7|N|8|@]|9|@$D|O|E|P|1|Q]]|A|$]]|$1|F|3|-4|5|6|7|R|8|@]|9|@]|A|$]]]|G|$H|$5|I|J|K|A|$L|C]]]]

Try the jquery selectbox plugin, it's great and do exactly what you are trying to:

<a href="http://jquery-ui.googlecode.com/svn/branches/labs/selectmenu/index.html" rel="nofollow">http://jquery-ui.googlecode.com/svn/branches/labs/selectmenu/index.html</a>

blocks|key|163485|text|不幸的是，糟糕的组合。来自文档http://www.w3.org/TR/css3-box/#overflow-x|type|unstyled|depth|inlineStyleRanges|entityRanges|offset|length|data|163486|计算值“overflow”和“overflow”与它们的指定值相同，只是一些“可见”的组合是不可能的:如果一个指定为“可见”，而另一个指定为“滚动”或“自动”，则“可见”设置为“auto”。|163487|entityMap|0|LINK|mutability|MUTABLE|url|http://www.w3.org/TR/css3-box/#overflow-x^0|F|15|0|0|0^^$0|@$1|2|3|4|5|6|7|N|8|@]|9|@$A|O|B|P|1|Q]]|C|$]]|$1|D|3|E|5|6|7|R|8|@]|9|@]|C|$]]|$1|F|3|-4|5|6|7|S|8|@]|9|@]|C|$]]]|G|$H|$5|I|J|K|C|$L|M]]]]

Bad combination, unfortunately. From the documentation <a href="http://www.w3.org/TR/css3-box/#overflow-x" rel="nofollow">http://www.w3.org/TR/css3-box/#overflow-x</a>:

The computed values of ‘overflow-x’ and ‘overflow-y’ are the same as their specified values, except that some combinations with ‘visible’ are not possible: if one is specified as ‘visible’ and the other is ‘scroll’ or ‘auto’, then ‘visible’ is set to ‘auto’.

I have a div set to hide content with <code>overflow-x</code> and display (<code>visible</code>) content with <code>overflow-y</code>. 
Unfortunately it's not working how I'd like it to. It adds vertical scroll bars - I assume this is because <code>overflow-x</code> and <code>overflow-y</code> don't function together. 
As far as I'm aware if one overflow is set to hidden, the other gets set to auto. 
Is there any other way around this? So I can have the overflow hidden horizontally and displayed (without a scroll) vertically? 
Just so there's no confusion here's a fiddle to explain a little more: <a href="http://jsfiddle.net/kwnQk/" rel="nofollow">http://jsfiddle.net/kwnQk/</a>

edit 
Here is the actual issue I'm having: <a href="http://jsfiddle.net/kwnQk/1/" rel="nofollow">http://jsfiddle.net/kwnQk/1/</a> 
I have a select box, created from divs and jQuery, that ends up going over the div height, causing it to add scroll bars. 
It's a shame the overflow function works the way it does because the div's <code>overflow-x</code> must be hidden, causing the div's <code>overflow-y</code> to be auto.

edit 2 
Please see this new JSFiddle to show exactly why I need the overflow: <a href="http://jsfiddle.net/kwnQk/3/" rel="nofollow">http://jsfiddle.net/kwnQk/3/</a> 
It consists of sliders too, which need to be set to a certain width. And they cannot take up the entire height of the page so I have to limit their height, too.

Overflow x and y?

翻译质量差，导致语言生硬或混乱。

没有提供实际的解决方法或示例。

解答不清晰，无法理解或解决问题。

页面排版不美观，阅读体验差。

文章

问答

视频

教程

学习中心

腾讯云实验室

直播

竞赛

腾讯云代码分析专区

腾讯iOA零信任安全管理系统专区

腾讯云架构师技术同盟交流圈

腾讯云数据库专区

腾讯云智能顾问专区

腾讯云原生专区

腾讯混元专区

腾讯云TCE专区

腾讯云Lighthouse专区

腾讯云HAI专区

腾讯云Edgeone专区

腾讯云存储专区

腾讯云智能专区

腾讯轻联专区 

腾讯云开发专区

TAPD专区

腾讯轻量云游戏服专区

EdgeOne AI 安全实战专区

腾讯云最具价值专家

腾讯云架构师技术同盟

腾讯云创作之星

腾讯云开发者先锋

腾讯云代码助手

云原生构建

TAPD 敏捷项目管理

Cloud Studio

SDK中心

API中心

命令行工具

涵盖代码开发、场景应用、自动测试全流程，助你从零构建专属AI助手

一站式MCP教程库，解锁AI应用新玩法

聚焦“写作效率、视觉美观与运行性能”三方面进行全面升级，为您提供更高效、稳定的创作环境

社区富文本&Markdown编辑器全新改版上线，欢迎大家体验!

诚挚邀请您参与本次调研，分享您的真实使用感受与建议。您的反馈至关重要，感谢您的支持与参与！

社区新版编辑器体验调研

我的div设置为用overflow-x隐藏内容，用overflow-y显示(visible)内容。不幸的是，它并没有按照我所希望的那样工作。它增加了垂直滚动条--我认为这是因为overflow-x和overflow-y不能一起工作。据我所知，如果一个溢出设置为隐藏，则另一个设置为auto。还有别的办法吗？这样我就可以水平地隐藏溢出并垂直显示(没有卷轴)？只是为了没有混淆，这里有一个小提琴来解释更多

问溢出x和y？
EN

回答 4

Stack Overflow用户

Stack Overflow用户

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问溢出x和y？EN

回答 4

Stack Overflow用户

Stack Overflow用户

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问溢出x和y？
EN