Bouton CSS pas cliquable partout

Veuillez jeter un oeil à CETTE page.

S'il vous plaît nourrir dans certains aléatoire de données et cliquez sur les bords du bouton soumettre.

PROBLÈME: je ne suis pas en mesure de cliquer sur le bouton sur les bords.

OBJECTIF: je veux prolonger le sur-mesure-en part à tous sur le bouton.

Je pense que je dois présenter à elle. Mais je ne suis pas sûr de savoir où et comment cela doit être fait.

Le code que j'ai utiliser pour le bouton est

<?php echo $form->submit('Submit', array('class' => 'submit_input', 'div' => array('class' => 'stndrd_btn', 'style' => 'margin-top:20px;'))); ?>

Merci et bonne journée

InformationsquelleAutor vamosrafa | 2010-06-28
  1. 2

    Quelle bibliothèque/cadre utilisez-vous pour générer des formulaires? Le code que vous avez posté ne veut pas nous en dire plus sur le code HTML généré.

    De toute façon. Si vous examinez les DOM avec Firebug ou quelque chose de similaire, vous verrez que le bouton de l'élément ne couvre pas tout l'espace visuel.

    Regardant votre CSS (global_style.css), je peux voir que la largeur de ce bouton est codé en dur à 131 pixels:

    .submit_input {
    color:#FFF;
    margin:0 auto;
    text-align:center;
    font-size:14px;
    font-weight:bold;
    background:none;
    border:none;
    width:131px;
    height:22px;
    padding-top:6px;
    cursor:pointer;
}

    L'élément qui enveloppe le réel bouton (et montre le visuel pointeur curseur et l'image de fond) a une largeur de 140px et d'une hauteur de 30px.

    Maintenant, vous ne voulez pas coder en dur ces valeurs sur le bouton de nouveau, vous voulez mettre ce bouton pour 100% de la largeur et de la hauteur. Cela pourrait ne pas fonctionner si c'est un élément inline, donc vous devez définir son display propriété block. Remplacer le .submit_input sélecteur à la suivante:

    .submit_input {
    color:#FFF;
    margin:0 auto;
    text-align:center;
    font-size:14px;
    font-weight:bold;
    background:none;
    border:none;
    width: 100%;
    height: 100%;
    display: block;
    padding-top:6px;
    cursor:pointer;
}

    Cela devrait le faire. Des acclamations.

    InformationsquelleAutor Alan Orozco
  2. 1

    Définir la largeur et hauteur attributs dans submit_input classe css à 100%

    InformationsquelleAutor Darko Kenda