2009-10-22 11 views
3

J'ai une configuration de site qui fonctionne très bien dans IE8 et Firefox, mais comme vous pouvez le voir ici:Les boutons Radio ne s'affichent pas correctement dans IE7, mais OK dans Firefox?

alt text http://i36.tinypic.com/nzq63m.jpg

Est-ce un problème avec une transparence ou css .png? Ou est-ce juste quelque chose avec IE7.

Merci à l'avance :)

+2

Voyons un peu de code. Quelle est la couleur d'arrière-plan des boutons radio? –

+0

formulaire de saisie [type = radio], entrée de formulaire [type = case à cocher] \t \t \t \t \t {border: none;} Ce qui précède est le seul code lié à la page.Il n'y a pas d'autres écraser les commandes css sur le code qui est ci-dessous: Type d'occupation:
Freehold \t \t \t \t \t \t Forale Unknown Espérons que cela aide? – Wayners247

+1

Je n'ai pas ce problème en copiant votre code dans htmlsandbox.com. Pouvez-vous fournir plus de détails? Pouvez-vous utiliser IE Developer Toolbar et publier exactement quels styles sont appliqués à l'arrière-plan et aux boutons radio? – MikeWyatt

Répondre

1

Pour toute personne ayant un problème similaire, la façon de contourner c'était d'ajouter un

background-image: none; 

Pour le css pour les boutons radio :) Hope that helps.

4

Je ne sais pas si cela est le phénomène que vous rencontrez, mais il ne semble fortement cette façon, donc:

Les boutons radio sont < entrée > balises comme les autres. Si vous avez une règle CSS qui s'applique à toutes les balises d'entrée, elles se déclencheront pour les boutons radio (et les boutons et cases à cocher, etc.) tout comme les champs de saisie. IE est particulièrement notoire à propos de celui-ci, ironiquement.

Ce que je tendance à faire est d'utiliser le type suivant des extraits HTML:

<input type="radio" class="radio" ... /> 

Et puis définir mes règles CSS comme ceci:

input { 
    // stuff for most input fields goes here, e.g. 
    background-image:url(fancy.png); 
} 
input.radio { 
    // reverting the rules I don't want applied, e.g. 
    background-image:none; 
} 

Bien que cela n'utilise pas sélecteurs de fantaisie comme On pourrait argumenter qu'il faut le faire, il fait pour une excellente compatibilité avec les navigateurs existants, en particulier IE6 (qui, tant que Windows 2000 est toujours utilisé, ne disparaîtra probablement pas de l'Internet trop tôt).

0

Je IE 9 et avaient des antécédents de carrés blancs sur mon asp RadioButtonList indiqué ci-dessous:

<asp:RadioButtonList ID="RadioListSearchScope" runat="server" TextAlign="Right" > 
<asp:ListItem Text="Include Thread & Inquiry Keywords" selected="true" Value="0"></asp:ListItem> 
<asp:ListItem Text="Include Thread & Inquiry Title Text" Value="1"></asp:ListItem> 
<asp:ListItem Text="Include Inquiry & Response Body Text" Value="2"></asp:ListItem> 
<asp:ListItem Text="Search All the Above" Value="3"></asp:ListItem> 

Cela ressemblait bien dans Chrome, FireFox, etc. Cela a été résolu de ne pas avoir un attribut CssClass dans le contrôle RadioButtonList HTML, rappelez-vous ceci est rendu sous la forme d'une entrée en tant que type = radio, puis en ajoutant ceci à ma feuille de style CSS global:

input[type="checkbox"] { 
     background: transparent; 
     border: inherit; 
     width: auto; 
    } 
    input[type="radio"] { 
     background: transparent; 
     border: inherit; 
     width: auto; 
    } 

qui semblait t o Guérir les boutons radio! Le texte était O K - mais le petit 'bouton' avait environ une zone de 20x20px qui était blanche peu importe quoi. C'est bien jusqu'à ce que l'arrière-plan soit autre chose que du blanc!

J'espère que cela aide!