Assessment wanted for "Cool-looking box"

I can’t seem to figure out how to make the text align like in the example shown on the assessment page… and I can’t figure out how to make the box shadows look correct.

Link to my Glitch code

First time posting to this forum, so I apologize if I incorrectly shared my code or if I was too vague when describing the issues I’m having!

Hello @cindoor, nice job on your css! The box shadows look good, I think that maybe you just can’t fully appreciate the light on top because the color you chose for your background is already quite bright. You should maybe try darker color to see how it looks. For the vertical alignment of the text, what I personally came up with, is the following:

  1. Don’t set a fixed height.
  2. Set a padding for the top and the bottom instead.

The css would then be something along the lines of:

p {
    width: 200px;
    padding: 1em 0;
    text-align: center;
    /* the rest of your css here ... */
}

Good tips here @louisono.

Alternatively @cindoor, you could set line-height on the paragraph instead if height — this puts the actual text in the middle of the height.

1 Like

Thank you for the response! I made the adjustments and changed the background color to something darker and it looks a lot better! Thank you!

Oh awesome! line-height does help! Thank you!