首页 > html > children_parent > CSS Layout - 如何使父级足够宽以在同一行中保持两个孩子

CSS Layout - 如何使父级足够宽以在同一行中保持两个孩子

children_parent 【children_parent】
我们想知道如何使父级足够宽以在同一行中保持两个孩子。
代码展示 运行结果 

<!DOCTYPE html>
<html>
<head>
<style type='text/css'>
.header {
  width: 1500px;
  height: 100px;
  border: 1px solid;
  margin: 50px;
  text-align: center;
}

.block {
  width: 1500px;
  height: 300px;
  margin: 80px 80px 80px 50px;
  overflow: visible;
}

.block1 {
  width: 950px;
  height: 100%;
  border: 1px solid;
  margin-right: 80px;
  font-size: 12pt;
  text-align: left;
  float: left;
}

.block2 {
  width: auto;
  height: 100%;
  border: 1px solid;
  overflow: hidden;
  font-size: 9pt;
}
</style>
</head>
<body>
  <div class="header">Header (36pt)</div>
  <div class="block">
    <div class="block1">Block1 (12pt)</div>
    <div class="block2">Block2 (9pt)</div>
  </div>
</body>
</html>
</body>
</html>