@Ahmed1shihab
Branimir
@brane10All comments
- @brane10
Hello. You have a small problem with responsiveness. Check out landscape mode for mobile devices. A small part of the content is invisible. Nice greetings :)
- @aggie-lWhat are you most proud of, and what would you do differently next time?
I am proud of being able to consistently working on Frontend Mentor projects at least for an hour every day.
What challenges did you encounter, and how did you overcome them?N/A
What specific areas of your project would you like help with?Any feedback is welcome and appreciated :)
@brane10Hello. You have a small problem with responsiveness. Check out landscape mode for mobile devices. A small part of the content is invisible. Nice greetings :)
Marked as helpful - @manuelcardoso5005@brane10
Hello. You have a small problem with responsiveness. Check out landscape mode for mobile devices. A small part of the content is invisible. Nice greetings :)
Marked as helpful - @Tanguturipavan@brane10
Hey, a little observation. Your items are not vertically aligned very well, maybe you should use a tag instead of div? It is also not necessary to define the height, it was easier for you to just put the padding up and down and you would create the necessary height and then it would be nicely centered. For example, here's how I did it: .container a { color: var(--neutral-white); background-color: var(--neutral-grey); padding: 15px 0; border-radius: 10px; text-decoration: none; width: 30 rem; text-align: center; } All the best and keep going :)
- @brane10What are you most proud of, and what would you do differently next time?
.
What challenges did you encounter, and how did you overcome them?.
What specific areas of your project would you like help with?.
@brane10Thanks for the observation. I will apply your suggestions. :)
- @QodemiWhat are you most proud of, and what would you do differently next time?
Its just an html/css project.
What challenges did you encounter, and how did you overcome them?No challenges encountered tho.
What specific areas of your project would you like help with?No difficulty
@brane10Hey. Check for mobile phone landscape mode, everything gets messed up. Also in css it is not a good practice to use !important so try to avoid it. If the property did not apply without it, there is a reason somewhere, so debug your code and find the problem. I would also recommend that you define the font-size in percentages in the html and that you use rem instead of px everywhere in the rest of the project. That way your project will be more responsive and you won't have to write a media query or very little. Best regards :)
- @sivaoptr@brane10
Hey looks good. Do some research to define the body font-size in percentages and use rem instead of px in the rest of the project. Responsiveness will be easier for you. Best regards :)
Marked as helpful - @SamahTT@brane10
Good job.
- @mohamedkhaled2213What are you most proud of, and what would you do differently next time?
I am very new to javascript so this project boosted my confidence a little bit
@brane10Consider adding a check if the input is empty so that the submit button cannot be clicked. This is how it throws out the message: "You selected out of 5". It's also a good idea to write the JavaScript in a separate document. :)
Marked as helpful - @AmitDeka@brane10
Greeting! Consider adding a check if the input is empty so that the submit button cannot be clicked. This is how it throws out the message: "You selected out of 5". Also, if you write a media query for the same width: eg @media (min-width: 576px), you don't have to specify it more than once. You define it once and you can style several classes in it :D
Marked as helpful - @mcorusa@brane10
Hello, very good. I would recommend you to add some transition when opening and closing, to make it a little slower. And you could also optimize the logic in javascript using the ternary operator instead "if":
const imageSource = answer.classList.contains("hidden") ? "assets/images/icon-plus.svg" : "assets/images/icon-minus.svg"; btn.lastElementChild.setAttribute("src", imageSource);I love your work :D
Marked as helpful - @mcorusa@brane10
Hello, Small suggestion for the table. Instead of adding a border to td, try to put it on tr and since there is no last border, use the last-child property :)
tr {
border-bottom: 1px solid #ddd;}
tr:last-child {
border-bottom: 0;}
I love your work :D
Marked as helpful
