css - How can I reduce width of clarity stack component label -


how can reduce width of clarity stack component label

https://vmware.github.io/clarity/documentation/stack-view

i have added following custom style selector no luck

styles added :

.mystyle {     max-width: 10% !important;     flex-basis: 10% !important; } 

please refer plnkr: https://plnkr.co/edit/gum8yinqn9dsbo6k8nce?p=preview (view app.component.css file)

::ng-deep .stack-view .stack-block-label {   flex: 0 0 20%; } 

you need use ::ng-deep combinator or else styles won't applied within component. mentioned in angular documentation: https://angular.io/guide/component-styles (search ::ng-deep)


Comments

Popular posts from this blog

angular - Ionic slides - dynamically add slides before and after -

minify - Minimizing css files -

Add a dynamic header in angular 2 http provider -