Question

刚回到编码中，我无法解决这个简单的问题，所以任何帮助都非常感激。

基本上，'header-top'（红色）div应位于顶部，'header-bottom'（蓝色）div应位于底部。但是，顶部div只位于底部div之下。为什么是这样？我试过浮动，清除和边缘命令无济于事。

谢谢你。代码如下：

@charset "UTF-8";
/* CSS Document */

body{
	background-color:#ff0;	
	padding:0px;
	margin:0 auto; /* aligns content to touch the edge; gets rid of default spacing/margin between edge and content */
}

/* Header */
#header-wrap{
	background:#0F0;
	width:100%;
	height:auto;
	border-bottom: 3px solid #CCC;
	/* margin:0 auto; needed? */
}
#header-top{
	/* contains logo & title text */
	background:#F00;
	width:960px;
	height:200px;
	margin:0 auto; /* aligns centrally */
}
#header-bottom{
	/* contains navigation menu */
	background:#00F;
	width:960px;
	height:50px;
}

<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<link rel="stylesheet" type="text/css" href="style.css"/>
<!-- Meta Tags Below -->
<meta name="description" content="" />
<meta name="keywords" content="" />
<title>___________________________</title>
<!-- Google Analytics Code Below -->
<!-- _____________________________ -->
</head>

<body>
<div id="header-wrap">

<div id="header-top">
<div id="header-bottom">

</div>
</body>
</html>

Answer 1

您遇到语法错误。请关闭div元素。

<div id="header-wrap">
   <div id="header-top"></div>
   <div id="header-bottom"></div>
</div>

Div应高于其他div，而不是低于

1 个答案: