Assessment needed for Other Controls 1, 2 & 3

MDN Learn
#1

Hi there :slight_smile:,

Hope you are well :+1:

Kindly asking for a review of my markup for the Other Form Controls sub-chapter, exercises 1, 2 and 3 - codepen here.

Further questions:

  • The default styling for the box is making it look a bit weird. Assuming one would just leverage CSS to have it appear explicitly below the label? Is there a better HTML structure to follow that could achieve the same outcome?

Any other advice or guidance appreciated :slight_smile:

Best,
Phil

#2

Hi again @Phil_G

Here are my comments:

  • Task 1: :warning: Partly correct. You named your attributes wrong. They are called cols, rows and maxlength.
  • Task 2: :white_check_mark: Correct.
  • Task 3: :white_check_mark: Correct.

I wish you all the best,
Michael

1 Like
#3

Thanks very much Michael, corrected to reflect correct attribute names :slight_smile:

All the best,
Phil

1 Like
#4

Perfect :ok_hand:

I just see I forgot to answer your question:

Yes, that’s correct. CSS would be best way. You could give the labels display: block; so they will break the line. Another possibility would be to add display: flex; to the lis and use flex-flow: column.
If you want to just use HTML you would need to wrap the labels with <div>s to have the same effect. I wouldn’t recommend this approach. HTML should be used to build a semantic structure and CSS to add layout and style.

1 Like
#5

@mikoMK makes sense :+1: thank you for the (continued) sound advice

1 Like