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 173K
  • Win 110K
  • OS X 37K
  • Linux 26K
Jan 19 Jan 18 Jan 17 Jan 16 Jan 15 Jan 14 Jan 13 Jan 12 Jan 11 Jan 10 Jan 9 Jan 8 Jan 7 Jan 6 Jan 5 Jan 4 Jan 3 Jan 2 Jan 1 Dec 31 Dec 30 Dec 29 Dec 28 Dec 27 Dec 26 Dec 25 Dec 24 Dec 23 Dec 22 Dec 21 Dec 20 Dec 19 Dec 18 Dec 17 Dec 16 Dec 15 Dec 14 Dec 13 Dec 12 Dec 11 Dec 10 Dec 9 Dec 8 Dec 7 Dec 6 Dec 5
Windows 161 174 217 212 121 159 167 217 222 202 220 134 145 203 221 227 200 159 99 96 132 188 159 204 195 120 139 201 180 173 209 222 122 135 187 202 198 234 214 130 152 184 198 214 189 151
OS X 43 49 57 56 27 20 46 58 49 56 49 39 37 55 45 59 57 38 28 28 47 26 27 30 36 24 37 45 48 57 57 47 47 44 46 61 57 49 72 37 38 50 54 55 49 34
Linux 39 47 41 32 38 30 32 40 38 44 47 24 34 45 39 35 40 31 21 25 21 22 34 37 20 20 37 29 24 32 28 30 33 33 46 27 42 36 35 33 36 38 44 42 42 35

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
    • 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) Disable CSS completions in Emmet

    If you have Emmet installed, its completions will drown out the carefully researched, standards-based completions offered by this package. You can disable Emmet completions by adding these two lines to your Emmet Package settings.

    "show_css_completions": false,
    "disable_tab_abbreviations_for_scopes": "source.css"
    
  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!