CODEWITHSUNDEEP
csstwitter-bootstrap
Quas94
Quas94

Reputation: 3

Altering height of Bootstrap panel footer

I want to change the height of Bootstrap's panel footer to make it shorter, however after looking around everywhere I haven't found a way to do that whilst also adjusting the position of the text within the footer, so that it doesn't poke out the bottom.

(Merely adjusting the font size obviously wasn't enough)

Here is my code and a screenshot of my issue:

.panel-default>.panel-footer {
    color: rgba(0, 0, 0, 0.6);
    font-size: smaller;
    max-height: 20px;
}

<div class="panel-footer">
    (0 comments)
</div>

https://i.sstatic.net/aAXX8.jpg

Upvotes: 0

Views: 5582

Answers (1)

AngularJR
AngularJR

Reputation: 2762

Quas94 Hi there.
All you need to do here to change the height of the panel footer is this with some css.

Here is a Fiddle. 

.panel-heading{
    height:50px;
} 
.panel-body{
    min-height:150px; 
    background-color: gray;
}     
.panel-footer{
    height:100px; 
    background-color: chartreuse;
}

enter image description here

Upvotes: 1

Related Questions