Codecademy Sample Solution: Block Display vs. Inline Display

<style>
p {
    margin: 0px;
    padding-left: 10%;
    padding-right: 10%;
    text-align: justify;
    border-style: dashed;
    border-width: 1px;
    border-color: orange;
}
p.highlight {
    background: yellow;
    margin-top: 15px;
    margin-bottom: 15px;
    padding:0;
    margin-right:10%;
    margin-left:10%;
}
span {
    background: green;
}
</style>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas et vehicula urna. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. </p>
<p>Curabitur ligula magna, scelerisque sed cursus ac, consequat non quam. Etiam ipsum ligula, semper scelerisque fringilla nec, elementum eu dui. Aenean nec nunc nisi. </p>
<p class="highlight">
    <span>Highlight me! I'm an English paragraph!</span>
</p>
<p>Curabitur in purus at odio viverra bibendum id eu urna. Curabitur aliquet, odio a mattis semper, justo risus volutpat nunc, non ornare velit augue tincidunt quam.</p>
<p>Morbi commodo nisl mauris, convallis venenatis urna. Donec consequat tincidunt commodo. </p>
<p>Etiam luctus, risus non dignissim gravida, nibh enim tristique turpis, vel viverra mauris dui sit amet sem. Morbi dignissim dictum tortor, vel ullamcorper sem consequat et. </p>
<p class="highlight">
    <span>Highlight me! I am also in English!</span>
</p>
<p>Ut turpis ante, pharetra vitae euismod ac, euismod at enim. Proin porttitor venenatis diam, consectetur placerat urna mattis vulputate. Vestibulum tristique scelerisque rhoncus. </p>
<p>Donec ac lectus tortor, sit amet gravida enim. </p>