Franck
@SFN98All comments
- @Tr0nskimackSubmitted 8 months ago@SFN98Posted 8 months ago
Hello, your solution looks good and i have some suggestions that may improve your code:
when the user choose a number this one should be on focus
I saw that when user choose a number, this one doesn't appear on the thank you page, try to fixe it.
/// This function let us to choose a number function choosenumber(){ let numbers = document.querySelectorAll(".number div") for(let i=0; i<numbers.length;i++){ numbers[i].addEventListener("click", ()=>{ // Remove "active" class of all elements numbers.forEach(element => { element.classList.remove("active"); }); // Add "active" class of clicked element numbers[i].classList.toggle("active"); let choice = document.querySelector("span") if(numbers[i].classList.contains("active")){ choice.innerText=numbers[i].innerText } }) } }
There's an other way to do this, but this is how me i understood it.
you can also do that if the user click on submit without choosing a number, he receive an error message and disabled button
1 - @ooKademooSubmitted 8 months ago@SFN98Posted 8 months ago
Hello @ooKademoo your solution looks good, but i have some changes that you can make for the next solution. first of all try to use semantic HTML the more possible, so you can use <main></main>
then using margin to center an element is not the right practice. To center correctly an element on the page you can use this css code on the body:
body{ min-height:100vh; display:flex; justify-content:center; align-items:center; }
1 - @jimmylee2021Submitted 8 months ago@SFN98Posted 8 months ago
your solution looks good, but i have some changes that you can make for the next solution. first of all try to use semantic HTML the more possible, so you can use <main></main> for your container.
Then to center correctly an element on the page you can use this css code on the body:
body{ min-height:100vh; display:flex; justify-content:center; align-items:center; }
Marked as helpful1 - @HTorikeSubmitted 8 months ago@SFN98Posted 8 months ago
your solution looks good, but i have some changes that you can make for the next solution. first of all try to use semantic HTML the more possible, so you can use <main></main> then to center correctly an element on the page you can use this css code:
body{ min-height:100vh; display:flex; justify-content:center; align-items:center; }
Also you forgot to insert the favicon
Marked as helpful0