CODEWITHSUNDEEP
csstwitter-bootstrap-3
Timsen
Timsen

Reputation: 4126

How to change <ul> width?

On click of dropdown button I want to open a dropdown exactly as wide as button itself (54px) with % content. For some reason ul opens up and its just too wide. How do I change width? 

               <div class="input-group-btn">
                    <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">
                        DKK
                        <span class="caret"></span>
                    </button>
                    <ul class="dropdown-menu pull-right">
                        <li>
                            <button type="button" class="btn btn-default">
                                %
                            </button>
                        </li>
                    </ul>
                </div>

very basic fiddle : http://jsfiddle.net/dk2y7mxL/

Upvotes: 0

Views: 4251

Answers (2)

mudpuddle
mudpuddle

Reputation: 101

You will need to override the dropdown-menu class. There is a min-width property set to be 160px that can be overridden with the following.

.dropdown-menu {
    min-width:0px;
}

This will cause the dropdown to be only as wide as a button with a percent symbol in it.

Upvotes: 3

Kirk Powell
Kirk Powell

Reputation: 910

You can limit display sizes in Bootstrap by using <div class="col-xs-4"> to wrap the entire select div.

Upvotes: 0

Related Questions