CODEWITHSUNDEEP
bootstrap-4angular6
Mano0114
Mano0114

Reputation: 9

Angular Bootstrap button size

I'm using Angular 6 for my Project and it integrates with bootstrap. I'm using 

'<button class="btn btn-info">ADD</button>'

but my button looks a bit bigger than usual when it comes to a height which makes the UI looks bit ugly! Kindly give me a solution to solve this

enter image description here

Upvotes: 0

Views: 2276

Answers (2)

Vishw Patel
Vishw Patel

Reputation: 549

Bootstrap 4 provides below button size : 

<button type="button" class="btn btn-primary btn-lg">Large</button>
<button type="button" class="btn btn-primary">Default</button>
<button type="button" class="btn btn-primary btn-sm">Small</button>

Use as per you requirement. If you want to customize your own you can use override them or create new one with desires font-size.

Upvotes: 0

Gvs Akhil
Gvs Akhil

Reputation: 2581

You can just inspect your code and find the padding for your button and override those values with new values in your .css file

If you are using Bootstrap 4 buttons you can use these to override:

.btn {
  padding: 0.5rem 0.5rem !important;
}

Note: Padding values may change according to your button size

Upvotes: 1

Related Questions