【发布时间】:2010-01-15 13:37:50
【问题描述】:
当我尝试使用 javascript 事件更改类时,我的控件正在移动的页面布局出现问题。任何人都可以帮助解决这个问题的一些想法。似乎只有在出现左侧滚动条时在 IE 中才有问题。
这是一个html示例
<div id="container" style="overflow:auto;">
<div id="control1Container" style="left:17%;top:145px;display:inline;position:absolute;">
<div id="control1" class="listOUT" >I am a control</div>
</div>
<div id="control2Container" style="left:67%;top:145px;display:inline;position:absolute;">
<div id="control2" class="listOUT" >I am a control</div>
</div><!-- more controls here -->
</div>
所以现在想象容器 div 中的控件占用了足够的空间,溢出边距出现在左侧,即控件延伸到容器 div 的底部下方。如果我尝试将 control1 上的 listOUT 类更改为使用 javascript 说 listIN,则控件将向左移动。对我来说,如果容器 div 的新宽度和滚动条就位,浏览器似乎正在将 control1Container 重新调整到 17% 的新位置。
有什么想法吗?
【问题讨论】:
-
显示 = 显示?你的滚动条出现在什么元素上?
-
容器元素的滚动条出现。使用 javascripts 更改类时 control1Container 元素向左移动
-
另一件事:display:inline 实际上是 display:block 用于定位非静态元素的元素。
-
Resuduum 上面说您在上面的示例中有一个类型 .. 在您输入错误的内联样式中显示为显示 ..
-
容器元素根本不应该有滚动条,因为 control1container 和 control2container 都是绝对定位的,因此在常规页面流之外。不知何故,您的脚本似乎打破了控件的绝对定位,但我不知道没有看到类开关的实现以及 listIN 和 listOUT 的 css 定义(或演示页面)。
标签: javascript html css