button style in IE

Я заметил, что IE иногда имеет очень большую прописку вокруг текста кнопки. Кажется, он пропорционален количеству текста, который имеет кнопка. Это создает очень уродливые кнопки.button style in IE

Я не решаюсь делать кнопки с фиксированной шириной из-за проблем с интернационализацией. То же самое касается процентной ширины.

Как люди справлялись с этим, не устраивая DIVs, как кнопки?

источник

2009-10-14 mkoryak

У меня нет IE для экспериментирования (отсюда комментарий и не ответ), но попробовали ли вы использовать таблицу сброса, чтобы переопределить все настройки по умолчанию, а затем определить прописку самостоятельно? –

nope, настройка дополнения только добавляет к тому, что есть: P Слишком плохо. – mkoryak

Вот исправление, которое работает для меня:

<!--[if IE]> 
<style type="text/css"> 

input { 
    overflow: visible; 
    padding-left:2px; 
    padding-right:2px; 
} 

</style> 
<![endif]-->

источник

2009-10-14 18:31:56 mkoryak

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

Если это просто кнопки, которые вы хотите настроить поведение на это работает:

input[type='button'] { 
    overflow: visible; 
}

Вам не нужно делать это условно, так как он не влияет на отображение кнопки в других браузерах. Вы можете изменить правило как «отправить», а также «кнопку». Это полностью удаляет автоматическое psuedo-padding и позволяет добавлять собственные правила стиля.

источник

2009-10-15 13:29:21 Fenton

У меня создалось впечатление, что IE6 не поддерживает те типы селекторов (которые содержат значения атрибутов). Я ошибаюсь? – mkoryak

@ mkoryak: ПРАВИЛЬНО! –

Хммм. IE6 не получил конкретного упоминания в вопросе. – Fenton

-1

Я бы отрегулировал прокладку кнопок через CSS.

input {
padding: 0; }

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

источник

2009-10-15 13:34:12 Slevin

это не работает, как я упоминал в комментарии, это добавляет дополнительные дополнения к тому, что уже существует – mkoryak

-1

Убедитесь, что вы добавить доктайп в верхней части страницы, и это не будет делать больше:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

Вы можете прочитать о том, что это делает здесь: http://www.w3.org/TR/xhtml1/, но в основном он говорит, что страница типа HTML, который вы хотите использовать.

источник

2009-10-22 21:09:55 Bertine

Но, конечно же, это не разница между (X) спецификациями HTML, скорее, решит ли браузер использовать режим причуд или (его попытка в) стандартном режиме. См. Http://www.quirksmode.org/css/quirksmode.html – Stewart

@Bertime: DOCTYPE и quirks/standard mode НЕ имеют никакого отношения к дополнению, добавленному IE6 и IE7 вокруг текста кнопок. Даже в стандартном режиме и даже при использовании строгого DOCTYPE IE6 и IE7 по-прежнему продолжают добавлять текст дополнений дополняющих араунов. –

Это делает трюк:

input[type='button'], input[type='submit'] { overflow: visible; } 
/* add above also your desired button padding if you want. */

FYI:

Если вы хотите, вы не должны использовать IE conditonal комментарий, потому что это CSS не нарушает кнопки путь являются displaied на другом браузеры.
На IE7 работает, но IE6 не поддерживает [type='...'] селекторов, поэтому он будет игнорировать этот стиль. Для IE6 единственный способ сделать это - применить класс к каждой кнопке и добавить тот же CSS { overflow: visible; } для такого класса.
IE8 больше не нуждается в этом, потому что они, наконец, исправили это.

источник

2010-09-14 16:51:28

button style in IE

ответ

Смежные вопросы