Let's enable autocomplete for HTML inline CSS styles

[revelt]

Prerequisites

• Put an X between the brackets on this line if you have done all of the following:
  • Reproduced the problem in Safe Mode: http://flight-manual.atom.io/hacking-atom/sections/debugging/#using-safe-mode
  • Followed all applicable steps in the debugging guide: http://flight-manual.atom.io/hacking-atom/sections/debugging/
  • Checked the FAQs on the message board for common solutions: https://discuss.atom.io/c/faq
  • Checked that your issue isn't already filed: https://github.com/issues?utf8=✓&q=is%3Aissue+user%3Aatom
  • Checked that there is not already an Atom package that provides the described functionality: https://atom.io/packages

Description

Let's make the CSS autocomplete work in the HTML inline styles!

Not all front-end developers make web pages. Some make email templates. As you know, all email newsletter HTML code must have CSS placed inline. Currently that's a challenge because Atom CSS autocomplete doesn't work on HTML inline styles.

Steps to Reproduce

1. Create HTML file
2. Try placing style="display: block" on it, as in <img src="zzz.jpg" alt="zzz" style="display: block;">

Expected behavior: [What you expect to happen]

Autocomplete should work on the HTML inline CSS.

Actual behavior: [What actually happens]

Autocomplete does not work on the HTML inline CSS.

Versions

Atom 1.32.0-beta1
autocomplete-css 0.17.5

[MikeBax]

I am also an Email developer as Revelt above and experiencing the same issue. Many email clients remove the styles out of the head portion of the HTML email so inline styling is the only solution. I would really appreciate this being considered.

[musayazlik]

I dont understand anything. Can you make a video narration?

[MikeBax]

You know what autocomplete is? We are asking for it to work when you are using inline styles as well. There are some cases where exterior CSS files will not work, like HTML Emails.

[Vahhab]

It's strange! Are there any other plugins which handle this?

[binhvi1989]

let try use this style="{}" then remove {};