Question

我在页面上有一个宽的iframe，我想让它可以水平滚动。为了实现这一点，我把它放在div中并使用CSS使div成为可滚动元素。

这一切都运行良好一段时间，但我必须改变一些东西并破坏功能。我所做的一切似乎都让它再次发挥作用。 div显示正常，但ifame内容被切断（好像我有溢出-x设置为隐藏）。如果我将overflow-x设置为auto，即使内容对于div太宽，也不会出现滚动条。如果我设置overflow-x滚动，则会出现滚动条但不活动。我做错了什么？

HTML

＆＃13;

<div class="PopularTravelAccessories Centre">
  <h3 style="color:#e47911; font-family:Arial, Helvetica, sans-serif; text-align:left; line-height:0.2;">Title</h3>
  <iframe src="/path-to-iframe.php?" frameborder="no" scrolling="no"></iframe>
</div>

＆＃13;

CSS

＆＃13;

	.PopularTravelAccessories
		{
			width:100%;
			max-width: 500px;
			position:relative;
			-webkit-overflow-scrolling: touch;
			overflow-x: auto;
			overflow-y: hidden;  /*Remove vertical scroll bar*/
			border-top:1px;
			border-top-style:dashed;
			border-top-color:#999999;
			margin-top:10px;
			border-bottom:1px;
			border-bottom-style:dashed;
			border-bottom-color:#999999;
			margin-bottom:10px;
		}
		
		.PopularTravelAccessories iframe
			{
				width: 100%;
				height:215px;
			}

＆＃13;

Answer 1

好的我偶然发现了解决方案，我需要做的就是删除滚动=＆＃34; no＆＃34;来自iframe。不太清楚为什么会影响div上的滚动，但它对我有用。

溢出滚动无法在容器div

1 个答案: