HTML Range Input
Structured HTML
EXP:
40

HTML Range Input

<input type="range" /> is used to create a range input. A range input is useful when we want to take inputs within a certain range. Refer to the intial & final screenshots provided below.
THIS IS AN HTML PROBLEM. THE JAVASCRIPT IS USED ONLY FOR CONCEPT CLARITY, SO THAT VALUE CHANGE CAN BE SEEN VISUALLY.


Task for students

  • Must to have
    • after the h5 tag and before the div tag with class "value-display", create an input tag
    • this input tag should have a type attribute of "range", min attribute of "20", max attribute of "100" and id of "rangeInput"

UI reference
  • Use the given provided code and try to mirror the UI.


  • - Initial

    React

    - Final

    React

Evaluation
  • After submission, your solution will be evaluated automatically based on the tasks defined above.
  • Upon successful completion of all the tasks/requirements, you will get a full score, and there will not be any partial scoring.
  • You can work on your failed test cases & resubmit your solution.
  • Your problem will get evaluated instantly.

Do’s & don’t
  • Use the given code structure in editor and do not make any changes.
  • Do not modify existing classes or tags.
  • Focus on correct HTML structure and class names.

Query & feedback
  • In case of any query/feedback on this project, please fill this form & we will soon get in touch with you to resolve.

Best of luck, developers!