同位素div内的HTML元素位置

我在玩同位素js库，我已经有了一般的概念。当我将普通html/css（如输入&图表）放入同位素div时，我的问题就出现了，它并不像我预期的那样运行。这个html在同位素div之外按预期工作。同位素div内的HTML元素位置

当同位素的div被点击我扩大，并显示该项目的详细信息，其中包括输入，图表等

我的目标：

使包含输入可见表在jsfiddle。
明白为什么会发生这种情况，所以我可以把我喜欢的任何内容放在未来的这里。

代码：

CSS，这是造成问题。通过添加星号，可以将它应用于所有子元素。因此，我的表没有显示的原因是表，行，单元格和元素都是绝对定位的。

.containerDiv * { 
      margin: 0px; 
      position: absolute; 
     }

该解决方案的CSS（适用相对位置表元素）：

#chartFilters * { 
       position: relative; 
      }

来源

2014-02-19 John

我做了一个快速刷上的CSS和解决我的问题 - 看到更新的小提琴问题。最后是一个非常简单的问题，由于我的问题，它可能看起来很难，因此为什么在过去的24小时内没有社区的答案。

我希望我的步骤可以帮助其他人解决这些类型的问题，浏览器有一些很棒的工具可以帮助解决问题。

步骤我用来解决：

1）我发现的第一个有用的步骤是通过在页面上点击右键检查与Internet Explorer的元素。然后在它显示的源代码中使用右键单击选项将样式复制到元素。这给了我一个更小版本的HTML测试，我保存到一个独立的HTML。

2.）我开始拉出似乎无关的html元素，并使示例更简单。一旦我抽出一些东西，我会在IE中刷新html并检查发生了什么。 3）当我有一个简单的HTML，我看到了绝对定位和星号，然后我做了一个快速谷歌找到this stack question解释星号做什么。 4）我需要保留绝对造型以使同位素起作用，但是我可以指定同位素内的相对定位，我已经通过使用星号自己做了这件事，现在我知道它做了什么！ :)

#chartFilters * { 
       position: relative; 
      }

来源

2014-02-20 22:06:38 John

同位素div内的HTML元素位置

回答

相关问题