add task solution #776
Open
add task solution #776
Conversation
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
mykhalenych
suggested changes
Apr 25, 2023
|
not sure if my demo link is correct... |
Viktor-Kost
suggested changes
Apr 25, 2023
src/index.html
Outdated
Comment on lines
18
to
25
| <label for="surname">Surname:</label> | ||
| <input | ||
| type="text" | ||
| name="surname" | ||
| id="surname" | ||
| autocomplete="off" | ||
| class="form-input-gap" | ||
| > |
There was a problem hiding this comment.
- i'd recommend to wrap input with label to avoid using id/for
- apply class to your wrapper (label) instead of input to make outer indent
Suggested change
| <label for="surname">Surname:</label> | |
| <input | |
| type="text" | |
| name="surname" | |
| id="surname" | |
| autocomplete="off" | |
| class="form-input-gap" | |
| > | |
| <label> | |
| Surname: | |
| <input | |
| type="text" | |
| name="surname" | |
| autocomplete="off" | |
| class="form-input-gap" | |
| > | |
| </label> |
src/index.html
Outdated
| autocomplete="off" | ||
| class="form-input-gap" | ||
| > | ||
| <br> |
There was a problem hiding this comment.
it's better avoid using <br />. Use css
src/index.html
Outdated
Comment on lines
96
to
99
| <label> | ||
| Do you love cats? | ||
| <span> | ||
| <input |
There was a problem hiding this comment.
each input/select should be wrapped with a label
Suggested change
| <label> | |
| Do you love cats? | |
| <span> | |
| <input | |
| <div> | |
| Do you love cats? | |
| <label> | |
| <input |
src/index.html
Outdated
| > | ||
| <br> | ||
|
|
||
| <div class="form-input-gap"> |
There was a problem hiding this comment.
redundant wrapper. apply styles to your labels
Suggested change
| <div class="form-input-gap"> |
src/style.css
Outdated
Comment on lines
1
to
7
| .form-field { | ||
| margin-bottom: 20px; | ||
| } | ||
|
|
||
| .form-input-gap { | ||
| margin-bottom: 10px; | ||
| } |
There was a problem hiding this comment.
You may only apply classes only to your filedset and form field (label or div)
Example:
.fieldset:not(:last-child) {
margin-bottom: 20px
}
.field:not(:last-child) {
margin-bottom: 10px
}
etojeDenys
suggested changes
Apr 26, 2023
Comment on lines
88
to
103
| <label> | ||
| <input | ||
| type="radio" | ||
| name="yes" | ||
| value="yes" | ||
| > | ||
| Yes | ||
| </label> | ||
| <label> | ||
| <input | ||
| type="radio" | ||
| name="no" | ||
| value="no" | ||
| > | ||
| No | ||
| </label> |
There was a problem hiding this comment.
should be the same name attribute to avoid this
tetiana-ivanchenko
approved these changes
Apr 26, 2023
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
5 participants
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
No description provided.