{"action":"created","issue":{"url":"https://api.github.com/repos/ubuntudesign/vanilla-framework/issues/65","repository_url":"https://api.github.com/repos/ubuntudesign/vanilla-framework","labels_url":"https://api.github.com/repos/ubuntudesign/vanilla-framework/issues/65/labels{/name}","comments_url":"https://api.github.com/repos/ubuntudesign/vanilla-framework/issues/65/comments","events_url":"https://api.github.com/repos/ubuntudesign/vanilla-framework/issues/65/events","html_url":"https://github.com/ubuntudesign/vanilla-framework/issues/65","id":59418749,"number":65,"title":"Space between number and units","user":{"login":"anthonydillon","id":1413534,"avatar_url":"https://avatars.githubusercontent.com/u/1413534?v=3","gravatar_id":"","url":"https://api.github.com/users/anthonydillon","html_url":"https://github.com/anthonydillon","followers_url":"https://api.github.com/users/anthonydillon/followers","following_url":"https://api.github.com/users/anthonydillon/following{/other_user}","gists_url":"https://api.github.com/users/anthonydillon/gists{/gist_id}","starred_url":"https://api.github.com/users/anthonydillon/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/anthonydillon/subscriptions","organizations_url":"https://api.github.com/users/anthonydillon/orgs","repos_url":"https://api.github.com/users/anthonydillon/repos","events_url":"https://api.github.com/users/anthonydillon/events{/privacy}","received_events_url":"https://api.github.com/users/anthonydillon/received_events","type":"User","site_admin":false},"labels":[{"url":"https://api.github.com/repos/ubuntudesign/vanilla-framework/labels/bug","name":"bug","color":"fc2929"}],"state":"open","locked":false,"assignee":null,"milestone":null,"comments":2,"created_at":"2015-03-01T21:35:08Z","updated_at":"2016-05-09T14:20:57Z","closed_at":null,"body":"In SASS, if you use an operation to calculate a value, you then have to concatenate the unit. If you just append the unit, the resulting compiled CSS has a space between number and unit.\r\n\r\nEx.\r\nfont-size: ($size / $base)em;\r\nCompiles into:\r\nfont-size:2 em;\r\n\r\nThis is an error in CSS, because `2 em` is not an accepted property value. So, you need to concatenate the number and the unit, like this:\r\n\r\nfont-size:($size / $base)+em;\r\nCompiles into:\r\nfont-size:2em;\r\n\r\nDETAILS\r\n\r\nFiles:\r\ncore-mixins.scss lines 8-9-60-62-64\r\ncore.scss lines 212-218-222-228-283-286-457\r\n\r\nUPDATE 2014-05-21\r\n\r\nConcatenating number and unit turns the value into a string. In order to just convert a unit-less number to one with a unit, just multiply it for one desired unit.\r\n\r\nE.g.\r\n$size: 2;\r\n$base: 1;\r\n`($size / $base)em` compiles into `2 em` (not accepted property value)\r\n`($size / $base) + em` compiles into `2em` (string - accepted by CSS, but may cause problems in SASS)\r\n`($size / $base) * 1em` compiles into `2em` (number, em value - good both for CSS and SASS)"},"comment":{"url":"https://api.github.com/repos/ubuntudesign/vanilla-framework/issues/comments/217877969","html_url":"https://github.com/ubuntudesign/vanilla-framework/issues/65#issuecomment-217877969","issue_url":"https://api.github.com/repos/ubuntudesign/vanilla-framework/issues/65","id":217877969,"user":{"login":"yaili","id":223966,"avatar_url":"https://avatars.githubusercontent.com/u/223966?v=3","gravatar_id":"","url":"https://api.github.com/users/yaili","html_url":"https://github.com/yaili","followers_url":"https://api.github.com/users/yaili/followers","following_url":"https://api.github.com/users/yaili/following{/other_user}","gists_url":"https://api.github.com/users/yaili/gists{/gist_id}","starred_url":"https://api.github.com/users/yaili/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/yaili/subscriptions","organizations_url":"https://api.github.com/users/yaili/orgs","repos_url":"https://api.github.com/users/yaili/repos","events_url":"https://api.github.com/users/yaili/events{/privacy}","received_events_url":"https://api.github.com/users/yaili/received_events","type":"User","site_admin":false},"created_at":"2016-05-09T14:20:57Z","updated_at":"2016-05-09T14:20:57Z","body":"@anthonydillon What's the status on this?"}}