<div class="parent">
  <p class="first-child">
    Here is a paragraph housed in the parent element
  </p>
  <p class="second-child">
    This is the second child
  </p>
</div>
body {
  background-color: #f2f2f2;
  padding: 30px;
}

.parent {
  background: #49b293 /* green */;
}
.first-child {
  margin-bottom: 30px;
  background: #b03532 /* red */;
  height: 150px;
}
.second-child {
  margin-top: 20px;
  background: #da6f2b /* orange */;
  height: 100px;
}

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.