Google Chrome вставил теневую полем ошибку в Windows, не в Mac: Лучшее обходное решение?

Это является все еще текущим на Chrome 5.0.375.125, который является последним релизом Windows во время этой записи.

Ошибка прослежена здесь: http://code.google.com/p/chromium/issues/detail?id=25334

Так, проблема, если Вы находитесь в Windows или Linux, и кто-то использует тень поля вставки на элементе, который также имеет радиус границы, Вы получаете ошибку - радиус границы сохраняется, но разливы тени поля вставки из него, как будто это было все еще квадратное поле. Это работает как ожидалось в Chrome на Mac OS X.

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

Две части к этому взлому. Немного JavaScript (jQuery + jQuery.client плагин):

if ($.client.browser == "Chrome" && $.client.os != "Mac"){
  $('html').addClass("inset-radius-hack");
};

И CSS

#div{
  -moz-border-radius: 7px;
  -webkit-border-radius: 7px;
  border-radius: 7px;
  -moz-box-shadow: rgba(0, 0, 0, 0.4) 1px 1px 4px 0 inset;
  -webkit-box-shadow: rgba(0, 0, 0, 0.4) 1px 1px 4px 0 inset;
  box-shadow: rgba(0, 0, 0, 0.4) 1px 1px 4px 0 inset;
  padding: 5px 10px;
  margin-bottom: 10px;
  max-width: 120px;
}

  html.inset-radius-hack #div {
    border: 2px solid #fff; /* cover the edges with the border
    margin: 0 -2px 0 -2px; /* and take back the extra pixels the border adds
  }

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

Кто-либо придумал лучшее обходное решение для этого?

6
задан Kara 13 January 2014 в 03:29
поделиться