Time to Style explainer

help… please… what am i doing wrong??

body {
font-family: Helvetica, Arial, sans-serif;
text-align: center;
background-color: rgb(232, 246, 255);
}

h1 {
font-size: 32px;
margin: 0;
padding-bottom: 16px;
font-weight: 600;
background-color: rgb(255, 140, 0);
}

h2 {
font-size: 24px;
margin: 0;
padding: 16px 0 8px 0;
}

p {
font-size: 16px;
margin-bottom: 8px;
padding: 0;
line-height: 1.4;
}

button {
font-size: 16px;
padding: 10px 16px;
margin-bottom: 32px;
background-color: rgb(74, 144, 226);
color: rgb(255, 255, 255);
border: 0;
border-radius: 5px;
cursor: pointer;
}

img {
width: 200px;
height: auto;

}

Try this solution, it took me several times to figure out the problem. Hope this helps :slight_smile: ;
font-family: Helvetica, Arial, sans-serif;
text-align: center;
color: rgb(0, 50, 75)
background-color: rgb(232, 246, 255);
}

h1 {
font-size: 32px;
margin: 0;
padding-bottom: 16px;
font-weight: 600;
color: rgb(255, 140, 0);
}

h2 {
font-size: 24px;
margin: 0;
padding: 16px 0 8px 0;
}

p {
font-size: 16px;
margin-bottom: 8px;
padding: 0;
line-height: 1.4;
}

button {
font-size: 16px;
padding: 10px 16px;
margin-bottom: 32px;
background-color: rgb(74, 144, 226);
color: rgb(255, 255, 255);
border-radius: 5px;
cursor: pointer;
}
img{
width: 200px;
height: auto;
}

Hey there,

body should have both color and background-color. Try adding the color rule back:

color: rgb(0, 50, 75);

Hope this helps!
Ben

Hello i need help with my code it does not let me continue here it is:

body {
  font-family: Helvetica, Arial, sans-serif;
  text-align: center;
  color: rgb(0, 50, 75);
  background-color: rgb(232, 246, 255);
}

h1 {
  font-size: 32px;
  margin: 0;
  padding-bottom: 16px;
  font-weight: 600;
  color: rgb(225, 140, 0) }.

h2 {
  font-size: 24px;
  margin: 0;
  padding: 16px 0 8px 0;
}

p {
  font-size: 16px;
  margin-bottom: 8px;
  padding: 0;
  line-height: 1.4;
}

button {
  font-size: 16px;
  padding: 10px 16px;
  margin-bottom: 32px;
  background-color: rgb(74, 144, 226);
  color: rgb(255, 255, 255);
  border: 0;
  cursor: pointer;
  border-radius: 5px;
}
img {
    width: 200px;
    height: auto;
}

Please help me

Hey there, looks like the problem is on the last line of the h1 ruleset:

h1 {
  font-size: 32px;
  margin: 0;
  padding-bottom: 16px;
  font-weight: 600;
  color: rgb(225, 140, 0) }. /* This line right here! */

First, change 225 to 255.

Then, put a semicolon after color: rgb(255, 140, 0). Every rule in CSS has to end with a semicolon.

Finally, put the closing bracket down one line and delete the period. Like this:

h1 {
  font-size: 32px;
  margin: 0;
  padding-bottom: 16px;
  font-weight: 600;
  color: rgb(255, 140, 0); /* Note the semicolon and 255 */
} /* Bracket is on its own line */

Hope this helps!
Ben

1 Like

Wow thank you for all this help i appreciate it.

If anyone needs the answer here:

body {
  font-family: Helvetica, Arial, sans-serif;
  text-align: center;
  color: rgb(0, 50, 75);
  background-color: rgb(232, 246, 255);
}

h1 {
  font-size: 32px;
  margin: 0;
  padding-bottom: 16px;
  font-weight: 600;
  color: rgb(255, 140, 0); /* Note the semicolon and 255 */
} /* Bracket is on its own line */

h2 {
  font-size: 24px;
  margin: 0;
  padding: 16px 0 8px 0;
}

p {
  font-size: 16px;
  margin-bottom: 8px;
  padding: 0;
  line-height: 1.4;
}

button {
  font-size: 16px;
  padding: 10px 16px;
  margin-bottom: 32px;
  background-color: rgb(74, 144, 226);
  color: rgb(255, 255, 255);
  border: 0;
  cursor: pointer;
  border-radius: 5px;
}
img {
    width: 200px;
    height: auto;
}

body {
font-family: Helvetica, Arial, sans-serif;
text-align: center;
background-color: rgb(232, 246, 255);
color: rgb(0, 50, 75);
}
h1 {
font-size: 32px;
margin: 0;
padding-bottom: 16px;
font-weight: 600;
color: rgb (255,140,0);
}

h2 {
font-size: 24px;
margin: 0;
padding: 16px 0 8px 0;
}

p {
font-size: 16px;
margin-bottom: 8px;
padding: 0;
line-height: 1.4;
}

button {
font-size: 16px;
padding: 10px 16px;
margin-bottom: 32px;
background-color: rgb(74, 144, 226);
color: rgb(255, 255, 255);
border: 0;
border-radius: 5px;
cursor: pointer;
}
img {
width: 200px;
height: auto;
}
what is wrong?