Try it Yourself: CSS Margins

CSS Margins

<!DOCTYPE html>
<html>
<head>
<style>
.intro {
  margin-bottom: 30px;
}

.next {
  margin-top: 20px;
}
/* The visible gap between them is 30px */
</style>
</head>
<body>

<p class="intro">This is the intro paragraph.</p>
<p class="next">This paragraph follows right after.</p>

</body>
</html>

<!DOCTYPE html>
<html>
<head>
<style>
.intro {
  margin-bottom: 30px;
}

.next {
  margin-top: 20px;
}
/* The visible gap between them is 30px */
</style>
</head>
<body>

<p class="intro">This is the intro paragraph.</p>
<p class="next">This paragraph follows right after.</p>

</body>
</html>