Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

All comments

  • Franck• 180

    @SFN98

    Posted

    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
  • Franck• 180

    @SFN98

    Posted

    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
  • Franck• 180

    @SFN98

    Posted

    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 helpful

    1
  • Franck• 180

    @SFN98

    Posted

    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 helpful

    0