Le texte du bouton a disparu

J'essaie de créer un formulaire avec un bouton de soumission. J'essaye d'appliquer quelques css au bouton dans une feuille de style, mais pour une raison quelconque le texte a disparu du bouton! Lorsque je supprime tout css de la feuille de style (ou supprime l'identifiant de la div) le bouton disparaît complètement au lieu d'aller au style par défaut. Quelqu'un pourrait-il me dire ce que je fais mal?Le texte du bouton a disparu

HTML:

#submit 
 
    { 
 
     background-color: #5AB753; 
 
     color: black; 
 
     text-align: left; 
 
     border: none; 
 
     border-radius: 5px; 
 
     position: absolute; 
 
     left: 683px; 
 
     top: 500px; 
 
     width: 170px; 
 
     height: 51px; 
 
     font-family: 'Lato'; 
 
     text-align: center; 
 
     font-size: 30px; 
 
     color: #FFFFFF; 
 
     float: left; 
 
    } 
 

 
    #submit:hover 
 
    { 
 
     background-color: #96D091; 
 
     float: left; 
 
    }

<div id="submit" type="submit" value="Join now" />

Source

2017-10-10 Bug Catcher

Utilisez un élément button au lieu de div.

Notez que le type par défaut pour un button est submit, vous pouvez donc le supprimer.

#submit { 
 
    background-color: #5AB753; 
 
    color: black; 
 
    text-align: left; 
 
    border: none; 
 
    border-radius: 5px; 
 
    position: absolute; 
 
    left: 683px; 
 
    top: 500px; 
 
    width: 170px; 
 
    height: 51px; 
 
    font-family: 'Lato'; 
 
    text-align: center; 
 
    font-size: 30px; 
 
    color: #FFFFFF; 
 
    float: left; 
 
} 
 

 
#submit:hover { 
 
    background-color: #96D091; 
 
    float: left; 
 
}

<button id="submit">Join now</button>

Une Stackoverflow réponse avec de bonnes raisons d'utiliser button sur input type="submit" se trouvent ici: https://stackoverflow.com/a/33663114/5561605

Source

2017-10-10 15:58:06 sol

Bien sûr, il est aussi facile que cela. Je marquerai cela comme une réponse dès que possible (ne peut pas encore le faire à cause de cette limite de temps) –

actuel:

<div id="submit" type="submit" value="Join now" />

mise à jour du code html avec ci-dessous le code:

<input id="submit" type="submit" value="Join now" />

Source

2017-10-10 16:00:54

Merci pour cet extrait de code, qui peut fournir une aide immédiate. Une explication appropriée [améliorerait considérablement] (https://meta.stackexchange.com/q/114762) sa valeur éducative en montrant pourquoi c'est une bonne solution au problème, et le rendrait plus utile aux futurs lecteurs avec des semblables, mais pas identique, des questions. Veuillez modifier votre réponse pour ajouter une explication et donner une indication des limites et des hypothèses qui s'appliquent. – GrumpyCrouton

utilisation

#submit 
 
{ 
 
    background-color: #5AB753; 
 
    color: black; 
 
    text-align: left; 
 
    border: none; 
 
    border-radius: 5px; 
 
    position: absolute; 
 
    left: 683px; 
 
    top: 500px; 
 
    width: 170px; 
 
    height: 51px; 
 
    font-family: 'Lato'; 
 
    text-align: center; 
 
    font-size: 30px; 
 
    color: #FFFFFF; 
 
    float: left; 
 
} 
 

 
#submit:hover 
 
{ 
 
    background-color: #96D091; 
 
    float: left; 
 
}

<input id="submit" type="submit" value="Join now" />

Source

2017-10-10 16:01:31 Gattbha

Le texte du bouton a disparu

Répondre

Questions connexes