Add a solid border — practice exercise

What you'll be asked to do

1. 1.Add a solid borderexercise · easy · 10 min

   Give #box a 2px solid red border.

   Passes when: Give #box a 2px solid red border.

2. 2.Border one side onlyexercise · easy · 10 min · practice plan

   Give #box a 4px solid bottom border.

   Passes when: Give #box a 4px solid bottom border.

3. 3.Round the cornersexercise · easy · 10 min · practice plan

   Give #box an 8px border radius.

   Passes when: Give #box an 8px border radius.

4. 4.Use a dashed borderexercise · easy · 10 min · practice plan

   Give #box a 3px dashed border.

   Passes when: Give #box a 3px dashed border.

5. 5.Make a circleexercise · medium · 10 min · practice plan

   Give #box a 50% radius and equal width and height.

   Passes when: Give #box a 50% radius and equal width and height.

6. 6.Fix the border with no stylebug fix · easy · 8 min

   Without a style the border has no width at all.

   Passes when: Without a style the border has no width at all.

7. 7.Fix the misspelled stylebug fix · easy · 8 min · practice plan

   "solidd" is not a valid border style.

   Passes when: "solidd" is not a valid border style.

8. 8.Fix the wrong radius propertybug fix · easy · 8 min · practice plan

   The property is border-radius, not corner-radius.

   Passes when: The property is border-radius, not corner-radius.

9. 9.Fix the border on the wrong sidebug fix · easy · 8 min · practice plan

   The border was applied to the top instead of the bottom.

   Passes when: The border was applied to the top instead of the bottom.

10. 10.Fix the missing border widthbug fix · easy · 8 min · practice plan

    A border declared with only a colour renders at the default width.

    Passes when: A border declared with only a colour renders at the default width.

Between them these tasks cover Border shorthand, Border style and Border radius.

Looking for a different chapter? See every practice set, or switch to the interview theory questions.