How can I fix Buttongroup Dropdowntoggle-Buttons in Bootstrap?


Tags: html,css,asp.net-mvc,twitter-bootstrap

Problem :

I’m using Bootstrap 3 in my MVC-Project. In my _Layout page I’m using a buttongroup to do something like the example.

Example:

<div class="btn-group">
  <button type="button" class="btn btn-primary">MyButton</button>
  <button type="button" class="btn btn-primary dropdown-toggle" data-toggle="dropdown">
    <span class="caret"></span>
  </button>
  <ul class="dropdown-menu" role="menu">
    <li><a href="#">Hello</a></li>
    <li><a href="#">World</a></li>
  </ul>
</div>

(Surce: http://www.w3schools.com/bootstrap/bootstrap_button_groups.asp)

The issue is the button looks like this:

Screenshot of the Buttongroup

How can I fix this?

Edit: I need a solution without using a CDN or downloading a custom Bootstrap CSS-File



Solution :

I threw it into a CDN and it was fine. So that means it is your CSS. I would try adjusting the padding and/or the height of the .dropdown-toggle


    CSS Howto..

    How to enable overflow scrolling within a Semantic Ui Grid?

    How to add css to dynamic div Id

    Clip the vertical and horizontal overflow of
     tag outside of its container, and show scrollbars

    how to create sprite with css [closed]

    angularjs ui-grid changing column height to auto causes weird line to show up on other columns

    jquery .show() hides immediately

    How to align text and image in a CSS box?

    How to do letter spacing every two letters with CSS only?

    how to correctly render a response on an gsp from on the same page as the request (REST call) in grails

    How to do the Height of html tag Body on 100% of browser window size?

    How to stop web content from being displayed before css/jquery is prepared?

    How do I use CSS in ion-list, ion-item

    Why not show class css in email when using mail() php send mail to gmail?

    How to have a centered layout with border (background-image), and footer sticked to the bottom?

    How to Create 3 Column Layout with CSS Only?

    How can I vertically align the text in an anchor tag?

    How to hide extra overflow part of this angled css ribbon?

    how to avoid the ID name in css file

    How to override style of single RichFaces component

    how to change properties of a parent div on hover of child div

    How to hide repeated content from search engines with CSS?

    How to click an element by innerthtml using CSS selectors in Selenium

    jQueryUI Autocomplete: how to use 'first-of-type' and 'last-of-type' with #ui-active-menuitem?

    css: how to force images to scale at same amount?

    How to select col id using jquery to hide via css

    Using CSS or Java to Show or Hide Empty Content Area

    How to get CSS to select ID of specific pattern? [duplicate]

    How to create an interactive image with HTML5, Javascript, DOM and CSS

    How can I make editable fields with button?

    How to give line-break from css, without using
    ?