{"action":"created","issue":{"url":"https://api.github.com/repos/Polymer/polymer/issues/2558","labels_url":"https://api.github.com/repos/Polymer/polymer/issues/2558/labels{/name}","comments_url":"https://api.github.com/repos/Polymer/polymer/issues/2558/comments","events_url":"https://api.github.com/repos/Polymer/polymer/issues/2558/events","html_url":"https://github.com/Polymer/polymer/issues/2558","id":111022041,"number":2558,"title":":host styles have specificity issues vs. *","user":{"login":"notwaldorf","id":1369170,"avatar_url":"https://avatars.githubusercontent.com/u/1369170?v=3","gravatar_id":"","url":"https://api.github.com/users/notwaldorf","html_url":"https://github.com/notwaldorf","followers_url":"https://api.github.com/users/notwaldorf/followers","following_url":"https://api.github.com/users/notwaldorf/following{/other_user}","gists_url":"https://api.github.com/users/notwaldorf/gists{/gist_id}","starred_url":"https://api.github.com/users/notwaldorf/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/notwaldorf/subscriptions","organizations_url":"https://api.github.com/users/notwaldorf/orgs","repos_url":"https://api.github.com/users/notwaldorf/repos","events_url":"https://api.github.com/users/notwaldorf/events{/privacy}","received_events_url":"https://api.github.com/users/notwaldorf/received_events","type":"User","site_admin":false},"labels":[{"url":"https://api.github.com/repos/Polymer/polymer/labels/css","name":"css","color":"fbca04"}],"state":"open","locked":false,"assignee":{"login":"sorvell","id":78891,"avatar_url":"https://avatars.githubusercontent.com/u/78891?v=3","gravatar_id":"","url":"https://api.github.com/users/sorvell","html_url":"https://github.com/sorvell","followers_url":"https://api.github.com/users/sorvell/followers","following_url":"https://api.github.com/users/sorvell/following{/other_user}","gists_url":"https://api.github.com/users/sorvell/gists{/gist_id}","starred_url":"https://api.github.com/users/sorvell/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/sorvell/subscriptions","organizations_url":"https://api.github.com/users/sorvell/orgs","repos_url":"https://api.github.com/users/sorvell/repos","events_url":"https://api.github.com/users/sorvell/events{/privacy}","received_events_url":"https://api.github.com/users/sorvell/received_events","type":"User","site_admin":false},"milestone":null,"comments":1,"created_at":"2015-10-12T17:41:16Z","updated_at":"2015-10-28T21:41:18Z","closed_at":null,"body":"If in my demo I have\r\n```css\r\n<style is=\"custom-style\">\r\n  * { box-sizing: border-box; }\r\n</style>\r\n```\r\n\r\nAnd in my element that I import in this demo I have:\r\n```css\r\n<style>\r\n  :host { box-sizing: content-box; }\r\n</style>\r\n```\r\n\r\nThe `*` style always wins (the dev tools actually interprets it as `*:not([style-scope]):not(.style-scope)`), which means you need to pepper the `:host` styles with `!important`.\r\n"},"comment":{"url":"https://api.github.com/repos/Polymer/polymer/issues/comments/152002661","html_url":"https://github.com/Polymer/polymer/issues/2558#issuecomment-152002661","issue_url":"https://api.github.com/repos/Polymer/polymer/issues/2558","id":152002661,"user":{"login":"nazar-pc","id":928965,"avatar_url":"https://avatars.githubusercontent.com/u/928965?v=3","gravatar_id":"","url":"https://api.github.com/users/nazar-pc","html_url":"https://github.com/nazar-pc","followers_url":"https://api.github.com/users/nazar-pc/followers","following_url":"https://api.github.com/users/nazar-pc/following{/other_user}","gists_url":"https://api.github.com/users/nazar-pc/gists{/gist_id}","starred_url":"https://api.github.com/users/nazar-pc/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/nazar-pc/subscriptions","organizations_url":"https://api.github.com/users/nazar-pc/orgs","repos_url":"https://api.github.com/users/nazar-pc/repos","events_url":"https://api.github.com/users/nazar-pc/events{/privacy}","received_events_url":"https://api.github.com/users/nazar-pc/received_events","type":"User","site_admin":false},"created_at":"2015-10-28T21:41:18Z","updated_at":"2015-10-28T21:41:18Z","body":"@notwaldorf, it works the same way under native Shadow DOM.\r\nStyles applied to element from the outside have higher priority, nothing wrong here.\r\nWhile nesting element inside other element should not propagate styles, and it works exactly the way it should:\r\n```html\r\n<style>\r\n\t* { border: 1px solid red; }\r\n</style>\r\n<dom-module id=\"x-host\">\r\n\t<template>\r\n\t\t<p></p>\r\n\t\t<x-nested></x-nested>\r\n\t\t<p></p>\r\n\t</template>\r\n</dom-module>\r\n<dom-module id=\"x-nested\">\r\n\t<template>\r\n\t\t<style>\r\n\t\t\t:host { border: 1px solid blue; }\r\n\t\t</style>\r\n\t</template>\r\n</dom-module>\r\n<script>\r\n\tPolymer({is: 'x-host'});\r\n\tPolymer({is: 'x-nested'});\r\n</script>\r\n<x-host></x-host>\r\n```\r\n`x-host::shadow > x-nested` in this example have `blue` border, not `red` as everything else."}}