Situation :
- In this scenario, I have a section with a card, and
when the card is clicked, it expands and displays additional information (card-block) simultaneously
Task at Hand :
I need to increase the width and height of the card when expanded,
Here is the jsfiddle link: http://jsfiddle.net/Mwanitete/5bwryt1g/3/
NOTE: The functionality may not work in jsfidle, but it works on my localhost
HTML Code :
<div class="card">
<div class="card-header">
<a data-toggle="collapse" href="#test-block" aria-expanded="true" aria-controls="test-block">
card header
</a>
</div>
<div id="test-block" class="collapse">
<div class="card-block">
card block
</div>
</div>
</div>
Current Status :
- Currently, the card only expands and displays data without increasing its width and height.
What steps should I take to achieve the desired outcome?