Bonus Exercise: Text Box with Border!

Alright, you've practiced the line break and you've created a background color. Well, well, well, guess what you can do now!

Line Break + Background = Text Box with Border!!!

Well, that's a very loose equation, but you catch my drift. For all you overachievers out there, just a few extra properties can net you a border for your background color, as well! For example, here's the code snippet for this very background + border!

<div style="top: -20px; left: -20px; padding: 20px; background: #ddeedd; border: 4px solid #cccccc;">Content Here!</div>

Playing around with those hex codes will change the background and border color, in that order. If you remember from our first exercise, that '4px' bit controls the thickness of the line (or in this case, the border). I like 4 pixels, but you might want a thicker or thinner line. You also might want your border to be black, or purple, or mahogany! Go wild!

Note: You might notice that this bonus lesson doesn't have the same formatting as the others. For this lesson, I've assumed that you've got the foundational skills down and don't need the incredibly in-depth tutorials. Also, I'm lazy. (That's me, Danielle, not any of the other glorious folks that created this course!)