调整窗口

Question

我正在使用Twitter Bootstrap创建一个网站，并在调整浏览器窗口大小时遇到​​问题。我尝试将width和height用于div，同时让孩子div position: absolute;和父div {{1}无济于事。

这是代码

我试图展示的元素是通过PHP（地图）拉出的，这就是它重叠的方式。

我意识到我不应该在HTML中做样式，但我想在一个地方向您展示细节。

Answer 1

通过使用Twitter Bootstrap附带的两个类，我可以使地图按比例缩放而不重叠，名为

embed-responsive embed-responsive-16by9

这是他们的源代码

    .embed-responsive {
  position: relative;
  display: block;
  height: 0;
  padding: 0;
  overflow: hidden;
}

    .embed-responsive-16by9 {
  padding-bottom: 56.25%;
}

即使我试图手动使我的div成为position: relative;的父母和每个定位的孩子，但它不起作用，所以我猜这是关于高度和填充。感谢您的回复，我希望这个答案可以帮助更多人。

Answer 2

根据您发布的代码图像我可以得到的是，您正在以错误的顺序嵌套您的div，类面板页脚应该是面板的页脚，面板体是应该是什么在面板标题和面板页脚之间，或者换句话说，在面板内部。我还建议给你通过PHP回应的元素一个类，请发布更多代码，我很乐意提供帮助。有关Bootsrap面板的更多文档可以在here找到。  我通常使用面板来存储表单按钮，而不是图像。 我会将此作为评论，但无法在任何地方发表评论。