Why Does Border-Radius Not Work on #screenQuery in Chrome?

Border-Radius Neglect on Webkit for #screen

Query

Users encounter an unexplained issue where the border-radius property on the #screen element ceases to exist when using Google Chrome, while browsers like Firefox or IE9 exhibit no such issue.

Solution

Despite applying all necessary browser prefixes and the standard border-radius syntax, the element fails to render with rounded corners. The culprit is a bug within Chrome's rendering engine. To resolve this, employ the following workaround:

<code class="css">.element-that-holds-pictures {
   perspective: 1px; /* any non-zero value will work */
}</code>

This non-intrusive fix preserves the display's integrity, unlike the opacity:0.99 workaround.

The above is the detailed content of Why Does Border-Radius Not Work on #screenQuery in Chrome?. For more information, please follow other related articles on the PHP Chinese website!