CODEWITHSUNDEEP
phphtmlcsstwitter-bootstrap
L. Smith
L. Smith

Reputation: 105

Is there a way to limit a dropdown box size

I am using bootstrap to build my site and the dropdown I am using is too long for the page so some items cannot be seen, is there any way to, limit the length it can go to before needing the user to scroll, I have attached an image to show what I mean as well as the code I am currently using Image showing the dropdown issue

<ul class="dropdown-menu">
                                <li role="separator" class="divider"></li>
                                <li><a href="../category.php">Search By Category:</a></li>
                                <li role="separator" class="divider"></li>
                                <?php echo $htmlResult1; ?>
                              </ul>

The main results are brought in via php but follow the correct style to be listed

Any thoughts

Upvotes: 0

Views: 626

Answers (2)

topher
topher

Reputation: 14860

As @Luis P.A. said:

Set a max-height and overflow to <ul>

ul.dropdown-menu {
    max-height: 400px;
    overflow-y: auto; /*scroll results in a scrollbar even when the height < 400px */
}

Upvotes: 1

Verno
Verno

Reputation: 458

set the max-height and overflow attributes in your CSS

 .fixedHeight-ddl{
        height: auto;
        max-height: 300px;
        overflow-x: hidden;
    }

and your tag

class="dropdown-menu fixedHeight-ddl"

Upvotes: 1

Related Questions