CSS: Jumbotron Paragraph


#1

I set the font-size to 20px, and yet it still says "Oops, try again. Set the font-size to 20px"

Here's the code:

.jumbotron p {
color: #fff;
font-size:20px;
}


#2

It's probably a problem in your HTML code, can I see that please?


#3
<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>
</div> 

<div class="learn-more">
  <div>
	<div>
  	  <div>
		<h3>Travel</h3>
		<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>
	  </div>
	  <div>
		<h3>Host</h3>
		<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>
	  </div>
	  <div>
		<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>
	  </div>
    </div>
  </div>
</div>


@jibblyj


#4

I think you have an extra </div> after <p>Rent from people in over 34,000 cities and 192 countries.</p>, so that may be a problem, but that's if jumbotron is supposed to contain everything, which I'm not sure it does, so then again, I might be wrong.


#5

I tried taking that out and it still came up with "Oops, try again. Set the font-size to 20px"


#6

In this exercise, we are working on the CSS part of the page we are building so it will be more interesting to have a look at your CSS code.


#7

.nav a {
color: #5a5a5a;
font-size: 11px;
font-weight: bold;
padding-bottom: 14px;
padding-left: 10px;
padding-right: 10px;
padding-top: 14px;
text-transform: uppercase;
}

.jumbotron {
background-image: url('https://goo.gl/04j7Nn');
height: 500px;
}

.jumbotron h1 {
color: #fff;
font-size: 48px;
font-weight: bold;
}
.jumbotron p {
color: #fff;
font-size: 20px;
}


#8

I reset my zoom on my browser and it fixed the issue.


#9

Here is a tip guys, the computer reads code top to bottom, i had the same problem and you need to set the font size first then set the color, the other way will make set the color and then change the font with the default color.


#10

It doesn't affect CSS styling. As long as you have both font-size and color, then it will use both. Yes it does read top to bottom, but it doesn't change anything, it's just the code checker that forces you to, for good practice.