css - 当我将一个 DIV 放入另一个 DIV 时,它不会复制其宽度和高度

标签 css html

HTML代码:

<div id="container>

<div id="wrapper">Some text
</div>

</div>

CSS 代码:

div {

position:fixed;
display:block;
}

#container {
max-width:1500px;
height:10%;
}

#wrapper {
width:50%;
height:10%;
}

现在,我的 wrapper 和容器的大小相同,尽管您会认为 wrapper 是容器高度的一半,是容器高度的十分之一。不幸的是,它们现在都一样大。有人可以帮帮我吗?

最佳答案

您需要在 #container 上将 max-width 更改为 width 以获得正确的宽度:

#container {
  width: 1500px;
  height: 10%;
}

并且您需要删除 position: fixed 并在 html, body 上设置高度以使百分比高度起作用:

html, body {
  height: 100%;
}
div {
  position: fixed;
  display: block;
}

JSFiddle

(您还缺少容器 div 中的结尾 ",但我认为这是一个错字)

关于css - 当我将一个 DIV 放入另一个 DIV 时,它不会复制其宽度和高度,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/23414526/

相关文章:

php - 从表行中获取数据并将其传递给表单

javascript - Safari contenteditable div 焦点

html - 非最后一个 child 应用 :last-child 定义的 CSS 样式

html - &lt;style&gt; 标签需要 ;是否结束

javascript - 如何从一个 css 类中获取样式属性并将其设置为另一个 css 类?

javascript - JQuery $ ('iframe' ).ready 为什么不起作用?

javascript - 无法清除复选框

html - 最小化文本框在 html 中的尺寸非常大。它没有响应

HTML Inline Flex 不适应主类

html - 如果你将 CSS font-size 应用于 body 元素,你如何处理嵌套标签和继承?