Радио кнопки неправильно отображаются в IE7, но нормально в Firefox? - PullRequest
3 голосов
/ 22 октября 2009

У меня есть настройка сайта, которая работает нормально в ie8 и firefox, но, как вы можете видеть здесь:

alt text

Это проблема с прозрачностью CSS или PNG? Или это просто что-то с IE7.

Заранее спасибо:)

Ответы [ 3 ]

4 голосов
/ 19 марта 2010

Я не уверен, что это тот феномен, который вы испытываете, но это действительно так кажется, поэтому:

Радиокнопки являются тегами, как и любые другие. Если у вас есть правило CSS, которое применяется ко всем тегам ввода, они будут срабатывать для радиокнопок (и отправлять кнопки и флажки и т. Д.) Вместе с полями ввода текста. По иронии судьбы IE особенно известен.

Я обычно использую следующие фрагменты HTML-кода:

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

А затем определите мои правила CSS следующим образом:

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;
}

Несмотря на то, что в нем не используются причудливые селекторы, как можно было бы спорить, это обеспечивает превосходную совместимость с устаревшими браузерами, особенно с IE6 (который, пока Windows 2000 все еще используется, вероятно, не исчезнет из в интернете все слишком скоро).

1 голос
/ 06 ноября 2009

Для тех, кто сталкивался с подобной проблемой, можно было добавить

background-image: none;

К css для радиокнопок :) Надеюсь, это поможет.

0 голосов
/ 16 января 2014

У меня IE 9, и на моем asp RadioButtonList показан белый квадрат:

<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>

Это выглядело нормально в Chrome, FireFox и т. Д. Это было решено, если НЕ иметь атрибута CssClass в HTML-элементе управления RadioButtonList, помните, что он отображается как входное значение как type = radio, а затем добавляю его в мою глобальную таблицу стилей CSS :

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

Это, казалось, заживало радио кнопки! Текст был ОК, но маленькая «кнопка» имела область размером 20x20 пикселей, которая была белой, несмотря ни на что. Это нормально, пока фон не станет чем-то отличным от белого!

Надеюсь, это поможет!

...