Add spaces between property: value; in CSS #21

Merged
merged 2 commits into from Feb 5, 2014

Conversation

Projects
None yet
5 participants
@inlikealion
Contributor

inlikealion commented Jan 23, 2014

Does what it says on the label.

@inlikealion

This comment has been minimized.

Show comment
Hide comment
@inlikealion

inlikealion Jan 23, 2014

Contributor

Forgot spaces before opening brackets the first time around.

Contributor

inlikealion commented Jan 23, 2014

Forgot spaces before opening brackets the first time around.

@cust0dian

This comment has been minimized.

Show comment
Hide comment
@cust0dian

cust0dian Jan 23, 2014

Of course this is purely personal preference, but property: value style seems to be dominant at the moment:

  1. In specifications

  2. Default format for displaying CSS rules in browser's developer tools

    • Chrome's Developer Tools:

    Chrome Developer Tools HTML/CSS/DOM Inspector

    • Firebug for Firefox:

    Firebug HTML/CSS/DOM Inspector

    • Firefox's Developer Tools:

    Firefox Developer Tools HTML/CSS/DOM Inspector

  3. In Mozilla Developer Network refernce

    • From color property refernce:

      element { color: red }
      element { color: #f00 }
      element { color: #ff0000 }
      element { color: rgb(255,0,0) }
      element { color: rgb(100%, 0%, 0%) }
      element { color: hsl(0, 100%, 50%) }
      
      /* 50% translucent */
      element { color: rgba(255, 0, 0, 0.5) } 
      element { color: hsla(0, 100%, 50%, 0.5) }
  4. In various styleguides

Since CSS Guidelines is supposed to be a reference material, decreasing (although really small) amount of time needed to "parse" the code by utilizing the style that is more common should be a good thing.

I'm for merging this in 👍

Of course this is purely personal preference, but property: value style seems to be dominant at the moment:

  1. In specifications

  2. Default format for displaying CSS rules in browser's developer tools

    • Chrome's Developer Tools:

    Chrome Developer Tools HTML/CSS/DOM Inspector

    • Firebug for Firefox:

    Firebug HTML/CSS/DOM Inspector

    • Firefox's Developer Tools:

    Firefox Developer Tools HTML/CSS/DOM Inspector

  3. In Mozilla Developer Network refernce

    • From color property refernce:

      element { color: red }
      element { color: #f00 }
      element { color: #ff0000 }
      element { color: rgb(255,0,0) }
      element { color: rgb(100%, 0%, 0%) }
      element { color: hsl(0, 100%, 50%) }
      
      /* 50% translucent */
      element { color: rgba(255, 0, 0, 0.5) } 
      element { color: hsla(0, 100%, 50%, 0.5) }
  4. In various styleguides

Since CSS Guidelines is supposed to be a reference material, decreasing (although really small) amount of time needed to "parse" the code by utilizing the style that is more common should be a good thing.

I'm for merging this in 👍

@cm0s

This comment has been minimized.

Show comment
Hide comment

cm0s commented Jan 23, 2014

+1

@pim

This comment has been minimized.

Show comment
Hide comment
@pim

pim Jan 24, 2014

Well, this is how Harry writes CSS (example), so it might be a bit hard to get this merged to his very own guidelines ;)

pim commented Jan 24, 2014

Well, this is how Harry writes CSS (example), so it might be a bit hard to get this merged to his very own guidelines ;)

@inlikealion

This comment has been minimized.

Show comment
Hide comment
@inlikealion

inlikealion Jan 24, 2014

Contributor

@pim Actually this is out of context here on github. I have already asked @csswizardry about this on Twitter and he agreed: https://twitter.com/csswizardry/status/426406662015287296

I pointed out that given his method of using 2x spaces in markup between classes for legibility, it was inconsistent to remove spaces in his declarations what reduce legibility. Harry said he has already started adapting his style to be consistent with this and that he would be open to accepting this pull request.

Contributor

inlikealion commented Jan 24, 2014

@pim Actually this is out of context here on github. I have already asked @csswizardry about this on Twitter and he agreed: https://twitter.com/csswizardry/status/426406662015287296

I pointed out that given his method of using 2x spaces in markup between classes for legibility, it was inconsistent to remove spaces in his declarations what reduce legibility. Harry said he has already started adapting his style to be consistent with this and that he would be open to accepting this pull request.

@pim

This comment has been minimized.

Show comment
Hide comment
@pim

pim Jan 24, 2014

@inlikealion Oh, I understand. That’s good then – I prefer to use spaces too :)

pim commented Jan 24, 2014

@inlikealion Oh, I understand. That’s good then – I prefer to use spaces too :)

csswizardry added a commit that referenced this pull request Feb 5, 2014

Merge pull request #21 from inlikealion/edit-spaces
Add spaces between property: value; in CSS

@csswizardry csswizardry merged commit c50e444 into csswizardry:master Feb 5, 2014

@inlikealion inlikealion deleted the inlikealion:edit-spaces branch Feb 5, 2014

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment