---
title: "Create group button dropdown with dropdown header"  
description: "Create group button dropdown with dropdown header"  
author: "Ethan Karla"  
published: 2021-07-28  
updated: 2021-07-28  
canonical: https://www.mindstick.com/forum/156614/create-group-button-dropdown-with-dropdown-header  
category: "bootstrap"  
tags: ["bootstrap"]  
reading_time: 2 minutes  

---

# Create group button dropdown with dropdown header

How to create [group](https://yourviews.mindstick.com/view/81323/adani-green-energy-group-bags-world-s-biggest-solar-bid) [button](https://www.mindstick.com/articles/63/how-to-add-button-in-datagridview-in-csharp-dot-net) [dropdown with dropdown header](https://answers.mindstick.com/qa/93865/how-to-make-a-group-button-dropdown-with-dropdown-header)?

## Replies

### Reply by Anonymous User

To make a Group Button [Dropdown](https://www.mindstick.com/articles/263/ajax-toolkit-dropdownextender-in-asp-dot-net) with Dropdown [header](https://www.mindstick.com/articles/336036/explain-about-html-header-body-and-footer-tags) in Bootstrap see the below example:

```
<html lang='en'>
<head>
    <meta charset='utf-8'>
    <meta name='viewport' content='width=device-width, initial-scale=1, shrink-to-fit=no'>
       <title>Bootstrap Dropdown</title>
  <link rel='stylesheet' href='https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css'>
  <script src='https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js'></script>
  <script src='https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.16.0/umd/popper.min.js'></script>
  <script src='https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js'></script>
</head>
<body>
    <div class='container d-flex justify-content-center flex-column align-items-center'>
        <h2>Dropdown Header</h2>
        <p>Group Button Dropdown with Dropdown header</p>
        <div class='btn-group'>
            <button type='button' class='btn btn-outline-danger'>Ferrari</button>
            <button type='button' class='btn btn-outline-success'>Audi</button>
            <button type='button' class='btn btn-outline-primary'>Rolls Royce</button>
            <div class='btn-group'>
                <button type='button' class='btn btn-outline-info dropdown-toggle' data-toggle='dropdown'>
                    Mercedes
                </button>
                <div class='dropdown-menu'>
                    <a class='dropdown-item' href='#'>Mercedes-Benz C-Class</a>
                    <a class='dropdown-item' href='#'>Mercedes-Benz A-Class Limousine</a>
                </div>
            </div>
        </div>
    </div>
</body>
</html>
```

Hope this will help you.

Happy Coding!


---

Original Source: https://www.mindstick.com/forum/156614/create-group-button-dropdown-with-dropdown-header

Copyright © MindStick Software Pvt. Ltd. This Markdown version is provided for developers, AI systems, and offline reading.
