Confirmed users
295
edits
DevTools/CSSTips: Difference between revisions
no edit summary
(→Basics) |
No edit summary |
||
| Line 3: | Line 3: | ||
== Basics == | == Basics == | ||
* Make sure your code is present for the 3 platforms, and that files are referenced twice in Windows' jar.mn | * Make sure your code is present for the 3 platforms, and that files are referenced twice in Windows' jar.mn (once for XP, once for Vista/7) | ||
* Make sure each file starts with the standard copyright header | * Make sure each file starts with the standard copyright header | ||
* Functional stuff (for example, toggling the display property based on application state) should be in content css rather than theme css | * Functional stuff (for example, toggling the display property based on application state) should be in content css rather than theme css | ||
* Avoid <tt>!important</tt> but if you have to use it, make sure it's obvious why you're using it (maybe with a comment | * Avoid <tt>!important</tt> but if you have to use it, make sure it's obvious why you're using it (maybe with a comment) | ||
* Avoid magic numbers, prefer automatic sizing | * Avoid magic numbers, prefer automatic sizing | ||
| Line 24: | Line 24: | ||
** Example: <tt>-moz-linear-gradient(top, black 1px, rgba(255,255,255,0.2) 1px)</tt> | ** Example: <tt>-moz-linear-gradient(top, black 1px, rgba(255,255,255,0.2) 1px)</tt> | ||
* Always add a space before <tt> !important</tt> | * Always add a space before <tt> !important</tt> | ||
* Assume <tt>="true"</tt> in attribute selectors | * Assume <tt>="true"</tt> in attribute selectors | ||
** Example: Use <tt>option[checked]</tt>, not <tt>option[checked="true"]</tt> | ** Example: Use <tt>option[checked]</tt>, not <tt>option[checked="true"]</tt> | ||
* Use longhand versions of properties so it's clear what you're changing. | |||
** Example: Use <tt>border-color: red</tt>, not <tt>border: red;</tt> | |||
== Performance == | == Performance == | ||