{"action":"created","issue":{"url":"https://api.github.com/repos/ocombe/ng2-translate/issues/371","repository_url":"https://api.github.com/repos/ocombe/ng2-translate","labels_url":"https://api.github.com/repos/ocombe/ng2-translate/issues/371/labels{/name}","comments_url":"https://api.github.com/repos/ocombe/ng2-translate/issues/371/comments","events_url":"https://api.github.com/repos/ocombe/ng2-translate/issues/371/events","html_url":"https://github.com/ocombe/ng2-translate/issues/371","id":196872847,"number":371,"title":"Unable to style inner html passed into the json string","user":{"login":"JMeiringDev","id":24519810,"avatar_url":"https://avatars.githubusercontent.com/u/24519810?v=3","gravatar_id":"","url":"https://api.github.com/users/JMeiringDev","html_url":"https://github.com/JMeiringDev","followers_url":"https://api.github.com/users/JMeiringDev/followers","following_url":"https://api.github.com/users/JMeiringDev/following{/other_user}","gists_url":"https://api.github.com/users/JMeiringDev/gists{/gist_id}","starred_url":"https://api.github.com/users/JMeiringDev/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/JMeiringDev/subscriptions","organizations_url":"https://api.github.com/users/JMeiringDev/orgs","repos_url":"https://api.github.com/users/JMeiringDev/repos","events_url":"https://api.github.com/users/JMeiringDev/events{/privacy}","received_events_url":"https://api.github.com/users/JMeiringDev/received_events","type":"User","site_admin":false},"labels":[],"state":"open","locked":false,"assignee":null,"assignees":[],"milestone":null,"comments":4,"created_at":"2016-12-21T08:24:23Z","updated_at":"2016-12-21T08:51:16Z","closed_at":null,"body":"[ ] bug report => check the FAQ and search github for a similar issue or PR before submitting\r\n[x ] support request => check the FAQ and search github for a similar issue before submitting\r\n[ ] feature request\r\n\r\nI have added html tags to one of my translation strings as follows:\r\n\r\nHTML\r\n```\r\n<span class=\"ex-login\" [innerHTML]=\"'SIGN.EXLOGIN' | translate:clever\"></span>\r\n```\r\n\r\nJSON\r\n```\r\n\"EXLOGIN\": \"Iniciar con <span class='ex-text-lg'>{{value}}</span>\"\r\n```\r\n\r\nCSS\r\n```\r\n @media (max-width: 420px ) {\r\n    .ex-text-lg {\r\n      display: none!important;\r\n    }\r\n```\r\n  \r\n\r\nI need the login/iniciar con to fall away in a specific media query, and I had tested this with the plain text and it was working fine, but since I've added it as a translation, the style is not being picked up.\r\n\r\n* **ng2-translate version:** 4.2.0\r\n\r\n* **Angular version:** cli 1.0.0-beta.21\r\n \r\n* **Browser:** Chrome 55.0.2883.87 m\r\n\r\nPlease let me know if there is a known fix for this issue.\r\n"},"comment":{"url":"https://api.github.com/repos/ocombe/ng2-translate/issues/comments/268469247","html_url":"https://github.com/ocombe/ng2-translate/issues/371#issuecomment-268469247","issue_url":"https://api.github.com/repos/ocombe/ng2-translate/issues/371","id":268469247,"user":{"login":"ocombe","id":265378,"avatar_url":"https://avatars.githubusercontent.com/u/265378?v=3","gravatar_id":"","url":"https://api.github.com/users/ocombe","html_url":"https://github.com/ocombe","followers_url":"https://api.github.com/users/ocombe/followers","following_url":"https://api.github.com/users/ocombe/following{/other_user}","gists_url":"https://api.github.com/users/ocombe/gists{/gist_id}","starred_url":"https://api.github.com/users/ocombe/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/ocombe/subscriptions","organizations_url":"https://api.github.com/users/ocombe/orgs","repos_url":"https://api.github.com/users/ocombe/repos","events_url":"https://api.github.com/users/ocombe/events{/privacy}","received_events_url":"https://api.github.com/users/ocombe/received_events","type":"User","site_admin":false},"created_at":"2016-12-21T08:51:16Z","updated_at":"2016-12-21T08:51:16Z","body":"Might be a problem with how you define your styles.\r\nIf you define them in your component then angular will add a special attribute to the css tags (as well as to the dom nodes, this is the css hoisting), but this attribute is not added via ng2 translate.\r\n\r\nTo fix this you can either use `/deep/` in your css, or change the view encapsulation property to none: https://angular.io/docs/ts/latest/guide/component-styles.html#!#view-encapsulation"}}
{"actor":{"display_login":"ocombe"}}