28172 sujets

CSS et mise en forme, CSS3

[Résolu] Caprices avec checkbox

Bonjour,

J'au un code qui m'offre satisfaction :

<table>
    <tr>
        <td>Vous êtes</td>
        <td colspan="3" valign="middle">
            <label><input type="radio" name="vousetes" style="height:9px;" value="Professionnel" checked> Professionnel</label>
            <label><input type="radio" name="vousetes" style="height:9px;" value="Particulier"> Particulier</label>
        </td>
    </tr>
</table>


Par souci de relecture facile, j'ai définitivement opté pour les feuilles de style :

<link href="css/contact00.css" rel="stylesheet" type="text/css" media="all">

Dans cette feuille contact00.css, j'a pris soin d'insérer :

.checklist {
    height:9px;
}

Ensuite le code change donc légèrement:

<table>
    <tr>
        <td>Vous êtes</td>
        <td colspan="3" valign="middle">
            <label><input type="radio" name="vousetes" class="checklist" value="Professionnel" checked> Professionnel</label>
            <label><input type="radio" name="vousetes" class="checklist" value="Particulier"> Particulier</label>
        </td>
    </tr>
</table>


Et là, cela ne fonctionne plus :
les bulles ne sont plus rétrécies...

Pourquoi ? Avez-vous une piste pour m'aider.
Un grand merci d'avance.
Modifié par jytest (25 Jun 2011 - 20:44)
Bonjour,

Sous IE8 (pas testé < ou >IE8), il y a une réduction du bouton radio, mais avec déformation de ce-dernier.
Sous Firefox 4, la taille du bouton ne change absolument pas.

Les observations ci-dessus sont valables aussi bien avec une feuille de style externe, qu'avec le style incorporé, à condition d'avoir pris soin de placer un doctype.

Si tu veux changer l'aspect des boutons radio, voici une adresse qui donne un moyen de le faire (en faisant appel à la librairie Mootools!) : http://blog.tafticht.com/2007/09/02/tutorial-css-checkbox-des-boutons-radio/

Cordialment
Merci à tous les deux.
Par goût personnel, j'ai opté pour jquery...
et c'est génial !
Encore merci.
Sujet clos
Aller à