Question

我有关于在我的网页上定位div的问题。我想把它放在我的其他两个元素之下，但我之前尝试过的所有内容都没有用 - 尽管互联网似乎告诉我应该这样做。这是我的代码：

#headingmain {
	position: relative;
	top: 150px;
	font-family: Comic Sans MS;
 }
 #main {
	margin: 0 auto;	
	border-radius: 25px;
	background: #73AD21;
	padding: 20px;
	width: 200px;
	height: 150px;
	 
 }
#para {
	position: relative;
	top: 150px;
	font-family: Comic Sans MS;
 }
 

 
#test {font-family: Comic Sans MS;}

<!DOCTYPE html>
<html>
	<head>
		<title>Title</title>
		<link rel="stylesheet" type="text/css" href="style.css">
		</head>
		<body>
			<h1 align="center" id="headingmain">Title</h1>
			<p id="para" align="center">para</p>

			<div id="main" align="center">
			<p id="test">Test</p>
			</div>
		</body>
	</html>

我不能为我的生活在互联网上找到一个教程，将div放在其他两个元素之下。这是我的最后一招，感谢你们提供的任何帮助。

再次感谢！

Answer 1

这是你想要实现的定位的一个非常简单的小提琴：http://jsfiddle.net/eh8ff325/3/

正如您所看到的，有两个嵌套div（#one＆gt; #two）和位于下方的#three div。

<main>
  <div id="one">One
    <div id="two">
      Test
    </div>
  </div>

  <div id="three">Three</div>
</main>

所有三个div都在一个容器内，它进行水平对齐和一些上边距。

将div放在页面上其他元素下面

1 个答案: