2

I am trying to use justify-content: space-evenly; in my CSS, but Atom shows space-evenly as greyed out like it is invalid. This is the relevant code:

  @media only screen and (max-width: 900px) and (min-width: 768px) {
    .plan-panel {
      -ms-justify-content: space-evenly;
      -webkit-justify-content: space-evenly;
      -moz-justify-content: space-evenly;
      justify-content: space-evenly; } }

And this is a pic of what I see in Atom

enter image description here

I found this at MDN web docs:

The alignment is done after the lengths and auto margins are applied, meaning that, if in a Flexbox layout there is at least one flexible element, with flex-grow different from 0, it will have no effect as there won't be any available space.

But, I am not using the flex-grow property.

Does anyone have a suggestion for why Atom wont play nice with this property/ value combination?

Sravan
  • 17
  • 7
pieguy
  • 95
  • 2
  • 10
  • 1
    `space-evenly` is only supported from Chrome v.60 and Firefox v.52 ... and you can drop all those prefixed values. If you show a minimal code sample, there is a workaround, using pseudo elements. – Asons Nov 22 '17 at 09:10
  • @Michael_B Thanks for directing me to the correct answer. – pieguy Nov 22 '17 at 14:38
  • @LGSon So...If a value like `space-evenly` is not universally supported, then Atom will indicate it's not valid by greying it out? – pieguy Nov 22 '17 at 14:40
  • Not knowing Atom fully, being run on Electron, if the render engine it use support a property or property value, I shouldn't grey it out. Also, those software normally doesn't use the latest engine, and if not, it doesn't _understand_ `space-evenly` yet (i.e. Chrome v. 60 was released 07/17, Firefox v. 52 in 03/17). – Asons Nov 22 '17 at 15:14
  • This question isn't a duplicate because it's about Atom's syntax highlighting, which is determined by the `language-css` package: https://github.com/atom/language-css – Holland Wilson Nov 22 '17 at 18:31
  • 1
    @HollandWilson I reopened the question, please provide your comment as an answer – Asons Nov 23 '17 at 08:55
  • paging @HollandWilson ... – TylerH Jun 15 '18 at 18:59

1 Answers1

1

The W3C's CSS validator also consider justify-content: space-evenly to be wrong possibly due to a small support from most browsers. Here's what it would say: "space-evenly is not a justify-content value".

Maxie Berkmann
  • 82
  • 2
  • 7