我正试图在我的整个网页周围放置一个黑框。
我希望父 div 围绕整个页面，而不仅仅是底部。我的 HTML 看起来像这样:
<body>
<!-- Header -->
<section id = "top" class = "top">
<div class="container">
<h1 class = text-center>Sarah Hynds</h1>
</div>
</section>
<!------ tabs ------>
<nav class="mynav">
<ul>
<li>
<a href="">About</a>
</li>
<li>
<a href="">Resume</a>
</li>
<li>
<a href="">Projects</a>
</li>
<li>
<a href="">Interests</a>
</li>
<li>
<a href="">Contact</a>
</li>
</ul>
</nav>
<hr id="separator" width="35%" color="black">
<div class="floating-box" id="about"></div>
<div class=floating-box" id="profile">
</div>
<div class="parentDiv"></div>
</body>
我的 CSS 是这样的:
.parentDiv {
width: 90%;
border: 1px solid #000000;
margin-top: 5%;
margin-left: 5%;
margin-right: 5%;
height: 100%;
display: inline-block;
padding-bottom: 50px;
display: inline-block;
white-space: nowrap; }
如何在整个页面周围放置边框？ 非常感谢!
最佳答案
<body>
<div class="parentDiv">
<!-- Header -->
<section id = "top" class = "top">
<div class="container">
<h1 class = text-center>Sarah Hynds</h1>
</div>
</section>
<!------ tabs ------>
<nav class="mynav">
<ul>
<li>
<a href="">About</a>
</li>
<li>
<a href="">Resume</a>
</li>
<li>
<a href="">Projects</a>
</li>
<li>
<a href="">Interests</a>
</li>
<li>
<a href="">Contact</a>
</li>
</ul>
</nav>
<hr id="separator" width="35%" color="black">
<div class="floating-box" id="about"></div>
<div class=floating-box" id="profile">
</div>
</div>
</body>
</html>
只需将它包裹在您希望它影响的内容周围即可。 :-)
关于html - 在整个网页周围放置一个父 div，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/45661725/