Learn CSS Colors by Building a Set of Colored Markers - Step 25

I couldn’t get solution for this

.container {
background-color: rgb(0, 0, 0);
top-padding:10px;
bottom-padding:10px;
left-padding: 0;
right-padding:0;

Your code so far

/* file: index.Ext.html */
h1 {
  text-align: center;
}

.container {
background-color: rgb(0, 0, 0);
top-padding:10px;
bottom-padding:10px;
left-padding: 0;
right-padding:0;

}

.marker {
  width: 200px;
  height: 25px;
  margin: 10px auto;
}

.one {
  background-color: rgb(255, 0, 0);
}

.two {
  background-color: rgb(0, 127, 0);
}

.three {
  background-color: rgb(0, 0, 255);
}
    
/* file: styles.Ext.css */
h1 {
  text-align: center;
}

.container {
background-color: rgb(0, 0, 0);
top-padding:10px;
bottom-padding:10px;
left-padding: 0;
right-padding:0;

}

.marker {
  width: 200px;
  height: 25px;
  margin: 10px auto;
}

.one {
  background-color: rgb(255, 0, 0);
}

.two {
  background-color: rgb(0, 127, 0);
}

.three {
  background-color: rgb(0, 0, 255);
}
    

Your mobile information:

SM-S901B - Android 14 - Android SDK 34

Challenge: Learn CSS Colors by Building a Set of Colored Markers - Step 25

Link to the challenge:

Just use the padding short hand property bro.

.container {
  background-color: rgb(0, 0, 0);
  padding: 10px 0;
}

and these are invalid.

top-padding:10px;
bottom-padding:10px;
left-padding: 0;
right-padding:0;

it should be
padding-top: 10px;
padding-bottom: 10px; etc

here is how to set the right padding for example:

padding-right : 1px;

the shorthand padding property can have multiple values, if there is two values:

/*padding: value1 value2;*/
padding: 2px 1px;

the first value represent top and bottom padding while the second represent right and left.
happy coding

2 Likes

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