Why needs .div an a, but .jumbotron not? css

.nav **a** {
    color: #5a5a5a;
    font-size: 11px;
    font-weight: bold;
    padding-top: 14px;
    padding-bottom: 14px;
    padding-left: 10px;
    padding-right: 10px;
    text-transform: uppercase;
.jumbotron **no a**{
    height: 500px;
    background-image: url('https://goo.gl/04j7Nn');

Why is that? I am a little confused. =)


Could you post your HTML code here so I can help? It would be handy if I could run it and see what you mean.

Thanks, JibblyJ.


<div class="jumbotron">
  <div class="container">
    <h1>Find a place to stay.</h1>
    <p>Rent from people in over 34,000 cities and 192 countries.</p>

<div class="learn-more">
		<p>From apartments and rooms to treehouses and boats: stay in unique spaces in 192 countries.</p>
		<p><a href="#">See how to travel on Airbnb</a></p>
		<p>Renting out your unused space could pay your bills or fund your next vacation.</p>
		<p><a href="#">Learn more about hosting</a></p>
		<h3>Trust and Safety</h3>
		<p>From Verified ID to our worldwide customer support team, we've got your back.</p>
		<p><a href="#">Learn about trust at Airbnb</a></p>

It's from Make a Website: CSS Styling lesson 3

Thanks for answering so fast.


Do you know about a elements? They are what we use to form links in our web pages, like this:

<a href="https://codecademy.com">Codecademy</a>

If we want to style those a elements then we must select them. That is what is going on with:

.nav a {

That says, select all the a elements in the nav div.

In your other example:

.jumbotron {

We didn't select the a elements there because we want to style the entire jumbotron not just the a elements that it might have.

Do you see how that works now?


So in the first example only the links are styled and in the second the whole jumbotron box?


Yes, do you understand?


Yes, I did. Thank you.