{"action":"created","issue":{"url":"https://api.github.com/repos/angular/material/issues/5317","labels_url":"https://api.github.com/repos/angular/material/issues/5317/labels{/name}","comments_url":"https://api.github.com/repos/angular/material/issues/5317/comments","events_url":"https://api.github.com/repos/angular/material/issues/5317/events","html_url":"https://github.com/angular/material/issues/5317","id":112817032,"number":5317,"title":"Bootstrap .hide negates material .show-*","user":{"login":"noamshemesh","id":5119937,"avatar_url":"https://avatars.githubusercontent.com/u/5119937?v=3","gravatar_id":"","url":"https://api.github.com/users/noamshemesh","html_url":"https://github.com/noamshemesh","followers_url":"https://api.github.com/users/noamshemesh/followers","following_url":"https://api.github.com/users/noamshemesh/following{/other_user}","gists_url":"https://api.github.com/users/noamshemesh/gists{/gist_id}","starred_url":"https://api.github.com/users/noamshemesh/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/noamshemesh/subscriptions","organizations_url":"https://api.github.com/users/noamshemesh/orgs","repos_url":"https://api.github.com/users/noamshemesh/repos","events_url":"https://api.github.com/users/noamshemesh/events{/privacy}","received_events_url":"https://api.github.com/users/noamshemesh/received_events","type":"User","site_admin":false},"labels":[],"state":"open","locked":false,"assignee":null,"milestone":null,"comments":2,"created_at":"2015-10-22T14:37:46Z","updated_at":"2015-10-22T16:50:14Z","closed_at":null,"body":"Hi,\r\nI bumped angular material version to the latest (1.0.0-rc1) to find out that the layout breaks. Any element that I set with `hide` attribute is now hidden even if it has another `show-*` attribute.\r\nThe reason is the [infamous `!important`](https://github.com/twbs/bootstrap/issues/9237) that bootstrap adds to their classes (yes, sorry, can't discard bootstrap yet).\r\n\r\nI think that this issue exists since version 0.11.0-rc1, one of the breaking changes was [Layout (flex, layout, etc) use Class selectors instead of Attribute selectors](https://github.com/angular/material/blob/master/CHANGELOG.md#breaking-changes-3)\r\n\r\n* [Relevant bootstrap code](https://github.com/twbs/bootstrap/blob/master/less/utilities.less#L27-L32)\r\n\r\nThanks!"},"comment":{"url":"https://api.github.com/repos/angular/material/issues/comments/150287432","html_url":"https://github.com/angular/material/issues/5317#issuecomment-150287432","issue_url":"https://api.github.com/repos/angular/material/issues/5317","id":150287432,"user":{"login":"epelc","id":5204642,"avatar_url":"https://avatars.githubusercontent.com/u/5204642?v=3","gravatar_id":"","url":"https://api.github.com/users/epelc","html_url":"https://github.com/epelc","followers_url":"https://api.github.com/users/epelc/followers","following_url":"https://api.github.com/users/epelc/following{/other_user}","gists_url":"https://api.github.com/users/epelc/gists{/gist_id}","starred_url":"https://api.github.com/users/epelc/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/epelc/subscriptions","organizations_url":"https://api.github.com/users/epelc/orgs","repos_url":"https://api.github.com/users/epelc/repos","events_url":"https://api.github.com/users/epelc/events{/privacy}","received_events_url":"https://api.github.com/users/epelc/received_events","type":"User","site_admin":false},"created_at":"2015-10-22T16:50:14Z","updated_at":"2015-10-22T16:50:14Z","body":"You should be able to just override bootstraps `hide` css. See the first answer [here](http://stackoverflow.com/questions/11178673/how-to-override-important). Adding the override after bootstraps should work."}}