Help with 10. Divs + Classes 10/12


#1


10. Divs + Classes10/12

<Below this line, in what way does your code behave

have incorrectly? Include ALL error messages.>
Did you give the div the right class?


Replace this line with your code. 

 div.prop{
        <img src="https://s3.amazonaws.com/codecademy-content/courses/web-101/unit-5/htmlcss1-img_diamond.png" width="60px">
        <h2>Luxury</h2>
        <p>We understand that you expect the world of your vacation - Jetsetter can provide once in a lifetime experiences at top of the line quality.</p>


#2

This is a CSS selector.

This is HTML code, you are mixing it up..

Please paste in your full code and error, thanks


#3

style.css

body {
  background-color: #FFF;
  margin: 0;
  padding: 0;
}

.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%;
}

/* Add the ID selector to this CSS rule */

#header-text {
  margin: 0 auto;
  position: relative;
  text-align: center;
  top: 25%;
  width: 60%;
}

h1 {
  color: #FFF;
  font-family: 'Quicksand', sans-serif;
  font-size: 70px;
  font-weight: 400;
  line-height: 60px;
  margin: 0;
}

h2 {
  color: #FFF;
  font-family: 'Open Sans', sans-serif;
  text-align: center;
  font-size: 28px;
  font-weight: 100;
}

h3 {
  color: #FFF;
  font-family: 'Quicksand', sans-serif;
  font-size: 28px;
  font-weight: 400;
  line-height: 30px;
  margin: 10px 0px;
  text-align: center;
}

h4 {
  color: #CCC;
  font-family: 'Quicksand', sans-serif;
  font-size: 16px;
  font-weight: 300;
}

p {
  color: white;
  font-family: 'Open Sans', sans-serif;
  font-size: 16px;
  font-weight: 100;
  line-height: 24px;
  margin: 0 auto;
  text-align: center;
  width: 60%;
}

/* Add the class selector to this CSS rule */

.partner {
  padding: 20px;
  text-align: center;
  margin: 0 auto;
  border-bottom: 1px solid #EEE;
}

.partner img {
  position: relative;
  top: 6px;
}

.aa-logo {
  padding-left: 6px;
}

.main {
  background: url("https://s3.amazonaws.com/codecademy-content/courses/web-101/unit-5/shards.png");
  margin: 0;
  padding: 40px;
}

.value-props {
  margin: 40px auto;
  width: 60%;
}

.prop {
  border: 1px solid #FFF;
  padding: 40px 0px;
  margin: 5px 0px;
  text-align: center;
}

.prop h2 {
  font-family: 'Quicksand', sans-serif;
  font-size: 24px;
}

#4

<!DOCTYPE html>
<html>
<head>
  <title>Jetsetter Concierge Travel Planning</title>
  <link href="https://fonts.googleapis.com/css?family=Open+Sans:300,400,600,700|Quicksand:300,700" rel="stylesheet">
  <link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>

  <div class="header">
    <div id="header-text"> <!--Add an id to this div -->
      <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>

  <div class="partner"> <!--Add a class to this div -->
    <h4>Proud Partner of Am South Airlines <img src="https://s3.amazonaws.com/codecademy-content/courses/web-101/unit-5/htmlcss1-img_amsoair.png" id="aa-logo" width="150px"></h4>
  </div>

  
    <h3>Why You Should Choose Jetsetter Concierge Travel Planning</h3>
    <p>With over 25 years of experience in concierge, high-end travel planning, we'll provide you with the highest quality services. Every vacation is unique, custom, and tailored to your tastes.</p>

    
      <div class="prop">
        <img src="https://s3.amazonaws.com/codecademy-content/courses/web-101/unit-5/htmlcss1-img_diamond.png" width="60px">
        <h2>Unique</h2>
        <p>We don't do standardized packages because we know everyone wants something different. Every vacation will be uniquely customized to your tastes.</p>
      </div>

      <div class="prop">
        <img src="https://s3.amazonaws.com/codecademy-content/courses/web-101/unit-5/htmlcss1-img_diamond.png" width="60px">
        <h2>Experienced</h2>
        <p>Our quarter century of experience in travel planning combines local knowledge with international taste. You'll be amazed at what we can provide!</p>
      </div>

 div.prop{
        <img src="https://s3.amazonaws.com/codecademy-content/courses/web-101/unit-5/htmlcss1-img_diamond.png" width="60px">
        <h2>Luxury</h2>
        <p>We understand that you expect the world of your vacation - Jetsetter can provide once in a lifetime experiences at top of the line quality.</p>
      
  }
   
  
  
</body>
</html>

#5

what is the error?  


#6

Hi,

Into Your Code You have to write div.prop{} into HTML Content. But As per the Rules you cant Write CSS into HTML Content Part.If We want To Apply CSS to Particular Content So We need to write CSS in
Part or else provide externally.

         <img src="//codecademy-discourse.s3.amazonaws.com/original/5X/9/6/f/e/96fe506c822d3867b9552e867bbdd83c281ea11c.JPG" width="540" height="100">

You dont write like that. Just you change like below code

        <img src="//codecademy-discourse.s3.amazonaws.com/original/5X/8/3/5/e/835e36f75cef326dd678eb42bea318bca4efdf8f.JPG" width="443" height="131">

THANK YOU,
Divyesh Padamani


#7

This topic was automatically closed 7 days after the last reply. New replies are no longer allowed.