search

digicorp / propeller

Propeller - Develop more, Code less. Propeller is a front-end responsive framework based on Google's Material Design Standards & Bootstrap.
http://propeller.in
MIT License
1.13k stars 141 forks source link

btn-block within a card overflows the card #28

Closed aaronhudon closed 6 years ago

aaronhudon commented 7 years ago

When a btn-block is used in a card action, it overflows the card on the right.

https://jsfiddle.net/4pL05gfL/

piyush-digicorp commented 7 years ago

Hello, Thank you for bringing this to our notice. We will get back to you with a proper solution for the same. Meanwhile, you can try adding below temporary solution- 

<div class="pmd-card-actions card-actions-block">
    <button class="btn btn-block pmd-ripple-effect btn-primary" type="button">Primary</button>
</div>
.card-actions-block{padding: 8px 16px;}
.card-actions-block .btn-block{margin:0}

In the above code snippet, we have added a class card-actions-block to parent div of the button, and modified the btn-block class css properties accordingly.

Hope this may solve your purpose.