Can you explain why the following HTML code uses two divs, one with a class and the other with an ID, instead of just using one of them to assign properties?
.header {
background-image: url("https://s3.amazonaws.com/codecademy-content/courses/web-101/unit-5/htmlcss1-img_canyon.jpeg");
background-position: center center;
background-size: cover;
height: 700px;
width: 100%;
}
#header-text {
margin: 0 auto;
position: relative;
text-align: center;
top: 25%;
width: 60%;
} <div class="header">
<div id="header-text">
<h1>Travel Like Never Before</h1>
<h2>Whether you're looking for adventure or luxury, let us help you plan your perfect getaway.</h2>
</div>
</div>