Селектор атрибута CSS для ввода type = "button" не работает в IE7 - PullRequest
Новая
       20

Селектор атрибута CSS для ввода type = "button" не работает в IE7

10 голосов
/ 02 февраля 2010

Я работаю над большой формой, и она содержит много кнопок по всей форме, поэтому я пытаюсь получить рабочий ввод [type = "button"] в моем основном файле CSS, чтобы он ловил все кнопки без добавление класса к каждому из них, по какой-то причине это не работает в IE7, после проверки в Интернете говорит, что IE7 должен поддерживать это.

Также это должно быть type = "button", а не type = "submit", так как не все кнопки отправят форму.

Может кто-нибудь дать подсказку, что я делаю не так? 

input[type="button"] {
    text-align:center;
}

Я тоже пробовал input[type=button]

Ответы [ 8 ]

27 голосов
/ 02 августа 2010

Я изо всех сил пытался заставить input[type=button] селекторы работать в IE7 или IE8. Проблема оказалась в том, что на страницах HTML отсутствовала декларация "! DOCTYPE". Однажды я добавил 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

Тогда все работало нормально. Очевидно, что вы можете использовать другую декларацию "! DOCTYPE", чтобы удовлетворить ваши требования.

8 голосов
/ 02 февраля 2010 
input[type="button"]{ text-align:center; }

Что вы ожидаете от этого? Текст в <input type="button"> уже центрирован по умолчанию.

Если вы хотите выровнять саму кнопку внутри родительского элемента, вы должны установить text-align для родительского элемента, а не для кнопки.

Селекторы атрибутов - с кавычками или без них - работают в IE7. Это IE6, это проблема браузера там.

3 голосов
/ 02 февраля 2010

У меня не было проблем с тем, чтобы такие операторы css работали в IE7; IE6 - это всегда проблема, но я верю, что этот CSS тоже подойдет. Поэтому я не думаю, что IE7 - это проблема.

Прежде всего, ваш пример CSS будет влиять только на кнопки, он не влияет на кнопки отправки. Но это легко исправить; измените свой CSS на: 

input[type="submit"], input[Type="button"]
{ text-align: center; }

Во-вторых, как сказал Маноло Сантос, не могли бы вы предложить еще один оператор CSS, который переопределяет настройку выравнивания текста? Настройка только для элементов ввода? Вероятно, стоит использовать инструмент разработчика, такой как Firebug, или компоненты разработчика, встроенные в Chrome или IE8, чтобы помочь найти проблему CSS.

1 голос
/ 09 июля 2012

Я почти уверен, что все знают о том, что решение добавить! DockType в заголовок не всегда возможно.

Например, я разрабатываю в среде DotNetNuke (DNN), в которой у разработчика нет доступа к заголовку. Тогда практически невозможно добавить! DocType.

В этом случае у вас не так уж много вариантов, кроме как связать CssClass с кнопкой и явно сослаться на нее в модуле CSS.

1 голос
/ 02 февраля 2010

Они работают для меня в IE7 (обе формы, с кавычками и без).

Может быть, есть другой селектор, который маскирует ваш. Вы можете попытаться сделать свой селектор более конкретным, чтобы придать ему более высокий приоритет, например ::10000 

body form input[type="button"] {
background: red;
}
1 голос
/ 02 февраля 2010

Селекторы атрибутов, к сожалению, еще не очень хорошо реализованы во всех основных браузерах, потому что это текущий стандарт CSS3, а не 2.1.Поскольку ребята из W3C не так быстро принимают решения, вам лучше не возлагать слишком большие надежды, потому что мы не сможем использовать css3 в ближайшее время.Некоторые его аспекты уже реализованы, но этого нет (конечно, не в IE6).

Так что, как вы уже сказали сами, было бы намного лучше обеспечить все ваши входные данные классом,и сделайте это привычкой делать это каждый раз, когда вы создаете форму.Это всегда удобно и не так много работы, когда вы уже программируете форму.

Когда я создаю форму, я всегда добавляю тип ввода как класс, например:

Особенно последние два пригодятся во многих случаях, потому что вы не должны стилизовать кнопки и кнопки по отдельности, но вы могли бы сделать это.

0 голосов
/ 14 мая 2012

По любой причине бывают случаи, когда селекторы атрибутов не применяются до того, как страница отображается в IE7.Это на самом деле только что произошло со мной.Мой селектор был table[bgColor="#c0c0c0"] и не будет применяться при загрузке страницы.Так как я использовал IE9 (режим браузера: IE7, режим документа: стандарты IE7), я смог использовать F12 Developer Tools для просмотра моего CSS-файла.Я снял флажок селектора, а затем снова проверил его.Атрибуты, примененные после этого.Это воспроизводимо точно в старой доброй IE7, поэтому мне придется искать обходной путь.(Примечание: ни использование одинарных, двойных или нулевых кавычек, ни внесение изменений в заглавные буквы здесь не оказывают влияния.)

0 голосов
/ 06 октября 2010

Этот вопрос старый, но если у кого-то есть связанная проблема ... Я трачу несколько минут, пытаясь решить подобную проблему

input [type = "Submit"] не работает в IE7 (несмотря на то, что IE правильно назначил стиль для ввода, как я видел в инструментах dev).

РЕШЕНИЕ: я переключился с Отправить на Отправить , и это сработало!

Я разместил это здесь, потому что это может помочь кому-то при отладке.

...