Community Expert

Answered

Accidental auto-prefixer in CC2018?

Forum|Forum|8 years ago
October 19, 2017
5 replies
1960 views

I found this by accident when trying to indent some CSS, I never noticed it in my now deleted CC2017, so it may have been there as well, but when I start with this code in my css...

.test {

background-image:linear-gradient(to bottom right, rgb(34, 46, 104), rgb(25, 83, 165), rgb(157, 206, 238));

}

...and put the cursor after the ending semi-colon and hit Tab with Emmet enabled, it creates...

.test {

background-image:-webkit-linear-gradient(top left, rgb(34, 46, 104), rgb(25, 83, 165), rgb(157, 206, 238));

background-image:-o-linear-gradient(top left, rgb(34, 46, 104), rgb(25, 83, 165), rgb(157, 206, 238));

background-image:linear-gradient(to bottom right, rgb(34, 46, 104), rgb(25, 83, 165), rgb(157, 206, 238));

}

Was this in CC2017, or did Adobe update Emmet without mentioning it?

(it does not work with Emmet turned off)

This topic has been closed for replies.

Correct answer pziecina

Found this in the documentation, (look at example 2) for emmet -

https://helpx.adobe.com/dreamweaver/using/writing-editing-code.html

As i said i checked with using emmet yesterday, and some vendor prefixing is possible, but not controllable.

With a proper auto-prefixer, you can control which browser version(s) to target, select to apply on save, to a specific selection, and if you wish browser specific css, (none w3c specs) to propergate to all vendors just in case they also adopt the none standard css code.

pziecina

Legend

For reference, this is the cheat sheet for emmet -

https://docs.emmet.io/cheat-sheet/

I wonder how many people can or want to use emmet, except for the items they use on a daily bases. Trying to remember all the possibilities would for me be impossible, and even with the cheat sheet i don't think i would save any time, as the time saved in typing would be spent in looking up the code, except as i say, for regularly used items.

O

osgood_

Legend

pziecina wrote
For reference, this is the cheat sheet for emmet -
https://docs.emmet.io/cheat-sheet/
I wonder how many people can or want to use emmet, except for the items they use on a daily bases. Trying to remember all the possibilities would for me be impossible, and even with the cheat sheet i don't think i would save any time, as the time saved in typing would be spent in looking up the code, except as i say, for regularly used items.

I dont really use it extensively. I think it makes you become a lazy coder. How many times have you forgotten the most basic html/css and think, WTF, I've been doing this 15+ years and I can't remember that. I know its just a blip in the memory but if you keep using this 'short-hand' it becomes 'normal' and you will forget the basics. I try where I can to maintain a good percentage of pure hand-coding. Some will say that's insane because it takes longer but I say it makes me a better coder and able to trouble shoot issues quicker. I'd take that over saving 10% any time.

O

osgood_

Legend

The problem i have with abbreviations is that over the years i have had to try and memorise thousands, (i gave up trying). In the aircraft industry there are actual manuals listing them, with the same acronym being used multiple time with different meanings across different aircraft.

I would also never recommend anyone trying to memorise the shortcuts, as i find that having to write it out fully, helps me remember exactly what the code does and how it works.

pziecina wrote
The problem i have with abbreviations is that over the years i have had to try and memorise thousands, (i gave up trying). In the aircraft industry there are actual manuals listing them, with the same acronym being used multiple time with different meanings across different aircraft.
I would also never recommend anyone trying to memorise the shortcuts, as i find that having to write it out fully, helps me remember exactly what the code does and how it works.

It's probably one reason why I also dislike like front-end css frameworks because its a game of memory or look-me-up and I know which is used frequently, look-me-up, plus when the framework is updated so are the css classes and additional ones are added. As you have said by the time you look it up, troublshooted etc you could have coded it yourself........virtually no time is saved.

pziecinaCorrect answer

Legend

Found this in the documentation, (look at example 2) for emmet -

https://helpx.adobe.com/dreamweaver/using/writing-editing-code.html

As i said i checked with using emmet yesterday, and some vendor prefixing is possible, but not controllable.

With a proper auto-prefixer, you can control which browser version(s) to target, select to apply on save, to a specific selection, and if you wish browser specific css, (none w3c specs) to propergate to all vendors just in case they also adopt the none standard css code.

Nancy OShea

Community Expert

I still have 2017.0.1. Yes, Emmet adds the vendor prefixes as you described.

Nancy

Nancy O'Shea— Product User & Community Expert

pziecina

Legend

Emmet does have some css features, but i tried them yesterday with css grid template syntax, and those did not work, (don't know if it should).

Jon Fritz

Author

Community Expert

Weird, I never noticed it in previous versions.

I knew about the hyphen in Emmet, but I didn't know it would expand an otherwise fully formed line of css like that.

Doesn't seem to do it on much else though.

Oh well.

pziecina

Legend

It is very limited, if it was not then i would not complain about not having a stand-alone autoprefixer as much as i do.

pziecina

Legend

Sorry, but if you go back to CS6, (i think it was) you will find that in preferences the vendor prefixing was introduced for this, along with transforms, transitions and border-radius.

Sign up

To post, reply, or follow discussions, please sign in with your Adobe ID.

Sign in to Adobe Community

To post, reply, or follow discussions, please sign in with your Adobe ID.

Scanning file for viruses.

This file cannot be downloaded