Require standard property with vendor prefix

Rule from css under compatibility category

What is a trooper!

we have submitted your edit to the community for review! We'll review and make it live on the site in the next few hours, the internet thanks you :).

Browse another section of the knowledge base



Suggest an edit

Cancel

This rule has no content... yet.

Add content to this rule

Or just browse to view rules that have content



 

When using vendor-prefixed properties such as -moz-border-radius, you should also include the standard property for future-compatibility. The standard property should come after the vendor-prefixed one to ensure the standard property is used by the browser.

/* BAD — No standard property*/
.mybox {
    -moz-border-radius: 5px;
}

/* BAD — standard property in wrong position */
.mybox {
    border-radius: 5px;
    -moz-border-radius: 5px;
}

/* GOOD */
.mybox {
    -moz-border-radius: 5px;
    border-radius: 5px;
}

How do I fix this ?

Putting the standard property after the vendor-prefixed property is the best way to ensure your CSS code will continue to work once the standard property is fully adopted (then you can take your time going back and removing the vendor-prefixed properties).

Resources

Browse another section of the knowledge base



Signup icon
Ready to see how well your site scores?

Passmarked works best when you have an account. It allows you to keep a dashboard with saved data of the sites you have run through the system, we’ll alert you about important updates and you get access to the Passmarked Slack forum.

Sign up to get started