радиус границы ie9

У меня есть следующее, которое работает в Firefox, Chrome и Safari. Но не в IE9. Он применяет закругленные углы к верхнему левому и правому краю td. Что мне не хватает?

border-left: solid 1px #444f82;
border-right:solid 1px #444f82;
border-top:solid 1px #444f82;
border-top-right-radius: 7px;
border-top-left-radius: 7px;
-moz-border-radius-topright: 7px;
-webkit-border-top-right-radius: 7px;
-khtml-border-radius-topright: 7px;
-moz-border-radius-topleft: 7px;
-webkit-border-top-left-radius: 7px;
-khtml-border-radius-topleft: 7px;
behavior: url(/survey_templates/PIE.htc);

person derekcohen    schedule 21.03.2011    source источник


Ответы (5)


У вас есть это в верхней части вашего HTML-документа (над тегом <html>)

<!DOCTYPE html>

IE9 требует этого, чтобы веб-сайт отображал новые элементы HTML5/CSS3.

Редактировать: или многие другие Doctype (XHTML и т. д., но это самый короткий и простой для запоминания)

person Adam Casey    schedule 21.03.2011
comment
‹!DOCTYPE html PUBLIC --//W3C//DTD XHTML 1.0 Strict//EN w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd - person derekcohen; 21.03.2011

Насколько я знаю, радиус границы должен работать в IE9. Возможно, вам не хватает этого в заголовке страницы:

<meta http-equiv="X-UA-Compatible" content="IE=edge" />

«край» означает «использовать последний движок рендеринга», поэтому IE 9 будет использовать 9, 10 — 10 и т. д.

person kprobst    schedule 21.03.2011
comment
это исправило - надеюсь, больше ничего не сломает - person derekcohen; 21.03.2011
comment
Невероятный. Добавление этого только что исправило все мои ошибки рендеринга IE9. Теперь выглядит точно так же, как WebKit, без каких-либо изменений CSS. - person adam; 26.06.2012
comment
спасибо спасибо за это! только жаль, что я не нашел этот ответ несколько часов назад:} - person Patrick Moore; 16.07.2012
comment
Насколько мне известно (и, пожалуйста, докажите, что я ошибаюсь, если есть пограничные случаи), но это не обязательно, если вы предоставляете действительный и современный тип документа. Не лучше ли указать тип документа, а затем добавить (другую) строку, специфичную для IE? - person Adam Casey; 02.10.2012
comment
@Dotmister: это звучит здорово, если вы захотите поделиться примером того, что вы подразумеваете под действительным и современным. Мне 56 лет, и я считаю кнопочный телефон современным, так как я вырос на старом поворотном телефоне. :) - person BobRodes; 09.10.2012
comment
Я не знаю почему, но мой <!DOCTYPE HTML> был недостаточно хорош для IE9, который находился в режиме стандартов IE7, пока я не добавил этот метатег. Спасибо за совет! - person Coderer; 16.05.2013
comment
@Dotmister: в зависимости от настроек браузера DOCTYPE недостаточно, чтобы вывести IE9 из режима совместимости. Оператор edge гарантирует это. - person Paolo Bergantino; 22.07.2013
comment
Я добавил это, и это все еще не работает! и у меня есть тег ‹!DOCTYPE html›! что блять не так?? - person Suzanne Edelman Creoconcept; 10.11.2016

В дополнение к причинам, упомянутым в других ответах, Проверьте в инструменте разработчика (нажмите F12), режим документа должен быть установлен на Internet Explorer 9 Standards

введите здесь описание изображения

person Shekhar_Pro    schedule 21.03.2011
comment
Он сказал, что стандарты IE 7 для документа - person derekcohen; 21.03.2011
comment
в этом проблема, измените его на стандарты IE9, и он должен работать нормально. - person Shekhar_Pro; 22.03.2011
comment
режим причуд: мое меню CSS в порядке, без радиуса границы. IE9 std: мое меню CSS аварийно завершает работу - person jondinham; 06.11.2011
comment
Каждый раз, когда я открываю инструменты разработчика и вижу «Стандарты версии IE», меня тошнит. Как будто IE вообще знает, что такое стандарты ;) - person danwellman; 28.05.2012
comment
Изменение настроек клиента просмотра не является решением проблем веб-разработки. Вы не можете знать, какие настройки будут у клиентов. - person Manachi; 11.09.2012

Отлично работает в проводнике 9 и 8 с:

<!DOCTYPE html>
<head>
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
</head>
person devluis    schedule 08.08.2013

Добавил <!DOCTYPE html> и <meta http-equiv="X-UA-Compatible" content="IE=edge" /> в заголовок страницы, и это решило мою проблему. Если border-radius не работает в IE9, вы должны добавить оба <!DOCTYPE html> и <meta http-equiv="X-UA-Compatible" content="IE=edge" /> в заголовок страницы. Имейте в виду, что если у вас есть <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> вверху вашей страницы, радиус границы может еще не отображаться в IE9, поэтому лучше изменить его на <!DOCTYPE html>

person Omid    schedule 28.05.2013
comment
Ответ кажется неполным. - person RedBaron; 28.05.2013
comment
Извините, не заметил, что после ввода коды стали невидимыми, я их поправил. - person Omid; 28.05.2013