title: how to increase div size in navbar dropdown menu in bootstrap 4
body: <p>I'm creating a navbar dropdown using Bootstrap 4.  But in my one of menu item I want to customize downdown menu items using my own code. When I tried this I'm not able to increase the width of dropdown menu content. on click of dropdown-link it should show content properly.</p>
  
  <p>Here below is the code.</p>
  
  <pre><code>    &lt;nav class="navbar navbar-expand-sm navbar-light bg-white text-black"&gt;
      &lt;div class="container"&gt;
          &lt;button class="navbar-toggler" type="button" style="border:none;outline:0;" data-toggle="collapse" data-target="#navbarResponsive"&gt;
              &lt;span class="navbar-toggler-icon"&gt;&lt;/span&gt;
          &lt;/button&gt;
          &lt;div class="collapse navbar-collapse" id="navbarResponsive"&gt;
              &lt;ul class="navbar-nav"&gt;
                  &lt;li class="nav-item"&gt;
                      &lt;a class="nav-link" href="#"&gt;T1&lt;/a&gt;
                  &lt;/li&gt;
  
                  &lt;li class="nav-item dropdown"&gt;
                      &lt;a class="nav-link dropdown-toggle" href="#" id="navbardrop" data-toggle="dropdown"&gt;
                          Dropdown link
                      &lt;/a&gt;
                      &lt;ul class="dropdown-menu" role="menu"&gt;
                          &lt;li&gt;
                              &lt;div class="row"&gt;
                                  &lt;div class="col-sm-6"&gt;
                                      &lt;div class="container"&gt;
                                          &lt;div class=""&gt;
                                              &lt;label label-default="" for="exampleInputEmail1"&gt;Email address&lt;/label&gt;
                                              &lt;input type="email" class="form-control" id="exampleInputEmail1" placeholder="Enter email"&gt;
                                          &lt;/div&gt;
                                      &lt;/div&gt;
                                  &lt;/div&gt;
                                  &lt;div class="col-sm-6"&gt;
                                      &lt;div class="container"&gt;
                                          &lt;div class="form-group"&gt;
                                              &lt;label label-default="" for="exampleInputEmail1"&gt;Email address&lt;/label&gt;
                                              &lt;input type="email" class="form-control" id="exampleInputEmail1" placeholder="Enter email"&gt;
                                          &lt;/div&gt;
                                      &lt;/div&gt;
                                  &lt;/div&gt;
                              &lt;/div&gt;
                          &lt;/li&gt;
                      &lt;/ul&gt;
                  &lt;/li&gt;
  
                  &lt;li class="nav-item"&gt;
                      &lt;a class="nav-link" href="#"&gt; T2&lt;/a&gt;
                  &lt;/li&gt;
                  &lt;li class="nav-item"&gt;
                      &lt;a class="nav-link" href="#"&gt;t3&lt;/a&gt;
                  &lt;/li&gt;
              &lt;/ul&gt;
          &lt;/div&gt;
      &lt;/div&gt;
  &lt;/nav&gt;
  </code></pre>
  
  <p>I'm expecting below output.</p>
  
  <p><a href="https://i.stack.imgur.com/8fUKg.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/8fUKg.png" alt="enter image description here"></a></p>