[英]Twitter bootstrap hides horizontal scrolling
I am using http://app.raw.densitydesign.org/#%2F angular application and have used twitter bootstrap for accordion. 我正在使用http://app.raw.densitydesign.org/#%2F角度应用程序,并已将twitter bootstrap用于手风琴。 Now, the problem is that when I am adding ui-bootstrap library, it is hiding the default horizontal scrolling functionality.
现在的问题是,当我添加ui-bootstrap库时,它隐藏了默认的水平滚动功能。 Without this, it works fine.
没有这个,它就可以正常工作。 So any suggestion, how can I make it working with this library.
因此,任何建议,如何使它与该库一起使用。
-- using 0.11.2 ui-bootstrap -使用0.11.2 ui-bootstrap
Thanks 谢谢
You can override that by using overflow-x. 您可以使用overflow-x覆盖它。 I couldn't see accordion on the link you gave but generally you can apply it by:
我看不到您提供的链接上的手风琴,但是通常可以通过以下方式应用它:
http://jsfiddle.net/882jof8L/ http://jsfiddle.net/882jof8L/
//CSS
#your-accordion .panel-body {
overflow-x: scroll;
}
//HTML
<div class="panel-body">
<table style="width: 1000px;">...</table>
</div>
Properties you can use with overflow-x: 可以与overflow-x一起使用的属性:
overflow-x: visible|hidden|scroll|auto|initial|inherit;
In your case adding your style sheet after bootstrap might help: 就您而言,在引导程序后添加样式表可能会有所帮助:
<link rel="stylesheet" href="YOUR_PATH/bootstrap.min.css">
<link rel="stylesheet" href="YOUR_PATH/YOUR_STYLE_SHEET.css">
Styles are applied in the order they are read by the browser. 样式按照浏览器读取的顺序应用。 This means styles appears at the top of a style sheet will be changed by the last one.
这意味着出现在样式表顶部的样式将被最后一个样式更改。
For example following style will result paragraph as black: 例如,以下样式将导致段落为黑色:
p { color: red; }
p { color: black; }
Or you can force browser to show scroll by using: 或者,您可以通过以下方式强制浏览器显示滚动条:
overflow-x: scroll !important;
What does !important do: 重要的是做什么的:
CSS rules that has the !important directive will always be applied no matter where that rule appears in the CSS document. 带有!important指令的CSS规则将始终应用,无论该规则出现在CSS文档中的什么位置。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.