ctrl+shift+p filters: :st2 :st3 :win :osx :linux
Browse

CSS3

by y0ssar1an ST3 Top 100

The most complete CSS support for Sublime Text 3

Details

Installs

  • Total 230K
  • Win 150K
  • OS X 47K
  • Linux 33K
Sep 24 Sep 23 Sep 22 Sep 21 Sep 20 Sep 19 Sep 18 Sep 17 Sep 16 Sep 15 Sep 14 Sep 13 Sep 12 Sep 11 Sep 10 Sep 9 Sep 8 Sep 7 Sep 6 Sep 5 Sep 4 Sep 3 Sep 2 Sep 1 Aug 31 Aug 30 Aug 29 Aug 28 Aug 27 Aug 26 Aug 25 Aug 24 Aug 23 Aug 22 Aug 21 Aug 20 Aug 19 Aug 18 Aug 17 Aug 16 Aug 15 Aug 14 Aug 13 Aug 12 Aug 11 Aug 10
Windows 191 198 253 309 306 305 350 188 250 293 380 284 256 185 188 169 221 217 277 266 251 145 124 217 207 209 134 211 130 150 201 247 224 230 223 119 174 178 217 234 224 221 146 161 193 204
OS X 27 53 42 67 54 57 60 53 53 91 84 77 58 42 31 38 38 46 52 80 37 34 28 43 48 50 27 49 24 25 34 42 44 48 39 27 34 56 38 60 44 64 31 38 38 54
Linux 25 37 34 35 55 35 28 33 34 35 61 45 29 19 31 35 37 35 30 38 36 27 27 46 31 33 34 44 26 30 33 38 28 33 41 27 39 32 23 42 38 36 22 26 29 36

Readme

Source
raw.​githubusercontent.​com

CSS3

Join the chat at https://gitter.im/y0ssar1an/CSS3

The most complete CSS and PostCSS-cssnext support for Sublime Text.

Features

  • Absurdly Complete: I mined the entire set of draft specs and supported everything. Some of this stuff won't be implemented in browsers for years. If it's in the spec, it's supported.
  • Future Proof: PostCSS-cssnext is fully supported. If you use cssnext, you can use futuristic CSS like…
    • nesting
    • custom selectors
    • custom properties
    • custom media queries
    • @apply
    • CSS Modules
    • lots more
  • Productive: Offers a full set of completions for properties, descriptors, @-rules, functions, and selectors. The completions are highly specific to what you're writing.
  • Modern: Bad, old CSS is flagged. Unnecessarily prefixed properties aren't highlighted. Catches lots of mistakes. Encourages best practices.
  • Faithful: Follows the W3C specs extremely closely.
  • Fast: CSS3 has been designed for Sublime's new custom regex engine, which is crazy fast. The syntax highlighting typically takes less than 100ms, even for very large CSS files.

Before & After

before and after

Installation

  1. Install Package Control
  2. Install CSS3

    Platform Install Command
    Mac cmd+shift+p   → Package Control: Install Package → CSS3
    Linux/Windows ctrl+shift+p → Package Control: Install Package → CSS3
  3. (Required) Disable the default CSS package

    Platform Disable Command
    Mac cmd+shift+p   → Package Control: Disable Package → CSS
    Linux/Windows ctrl+shift+p → Package Control: Disable Package → CSS

    disabling the default CSS package

    Make sure you don't have any open files set to the default CSS syntax (bottom-right) or you may get an error message.

  4. (Strongly Recommended) Enable completions inside completions

    By default, Sublime will not offer completions inside completions. In other words, the completions menu is suppressed when you're tabbing through a snippet. This prevents a lot of CSS3 completions from appearing. Add these keys to your User Settings to fix this:

    "auto_complete_commit_on_tab": true,
    "auto_complete_with_fields": true,
    
  5. (Recommended) Hide CSS completions from Emmet

    If you have Emmet installed, its completions will drown out the carefully researched, standards-based completions offered by this package. You can hide Emmet completions without disabling them by adding this line to your Emmet package settings. “json "show_css_completions”: false

  6. (Recommended) Set CSS3 as the default language for .css files

    • Open a .css file.
    • View → Syntax → Open all with current extension as… → CSS3

    setting CSS3 as default

Best Practices

Help Me Out!

If you think something's missing, make sure you're not asking for something on this list of bad CSS properties. If it's not on that list, open an issue and I'll investigate. Definitely check out the CONTRIBUTING guidelines before submitting your PR. It could save you a lot of time. I'll be monitoring the specs as they're updated on this W3C feed, but I still need your help. Let's keep bad code out of the Web!