<div>
&gt; This design is not responsive (the two columns of the dropdown should be placed under each other on small screens)<br />
<br />
On the example I saw <a href="https://codepen.io/dujp/pen/bYLdyX/" rel="ugc">https://codepen.io/dujp/pen/bYLdyX/</a>&nbsp;clicking on the hamburger menu for a small screen does as expected.<br />
<br />
Let's work on just one item and you can create a new thread for the other.
</div>


> This design is not responsive (the two columns of the dropdown should be placed under each other on small screens)

On the example I saw https://codepen.io/dujp/pen/bYLdyX/ [https://codepen.io/dujp/pen/bYLdyX/] clicking on the hamburger menu for a small screen does as expected.

Let's work on just one item and you can create a new thread for the other.

<div>
As no one answered, I searched again and with the help of someone who offered to put &quot;position: static&quot; on &lt;li&gt;, I was able to correct my codepen successfully.
</div>


As no one answered, I searched again and with the help of someone who offered to put "position: static" on <li>, I was able to correct my codepen successfully.

<div>
<div class="content wysiwyg-content">
I try to reproduce &nbsp;<a href="https://codepen.io/Omi236/pen/vZPgjz" rel="ugc">this BS 3 design</a>, in Bootstrap 4. <br />
<br />
The following Codepen <a href="https://codepen.io/dujp/pen/bYLdyX/" rel="ugc">https://codepen.io/dujp/pe<wbr />n/bYLdyX/</a> is where I arrived (drop down with 2 columns), helping me tutorials on the net. <br />
<br />
I have two problems:<br />
<br />

<ol type="1">
<li>This design is not responsive (the two columns of the dropdown should be placed under each other on small screens)</li>
<li>I would like the megamenu to occupy the full width of the navbar, as on the BS3 example, and be responsive</li>
</ol>
</div>
</div>


I try to reproduce  this BS 3 design (https://codepen.io/Omi236/pen/vZPgjz), in Bootstrap 4. 

The following Codepen https://codepen.io/dujp/pen/bYLdyX/ (https://codepen.io/dujp/pen/bYLdyX/) is where I arrived (drop down with 2 columns), helping me tutorials on the net. 

I have two problems:

This design is not responsive (the two columns of the dropdown should be placed under each other on small screens)
I would like the megamenu to occupy the full width of the navbar, as on the BS3 example, and be responsive


Mega menu dropdown problem with bootstrap 4

Web development includes all aspects of presenting content on intranets and the Internet, including delivery development, protocols, languages and standards, server software, browser clients, databases and multimedia generation.

Web Development

bootstrap v4

Bootstrap is a free and open-source collection of tools for creating websites and web applications. It contains HTML- and CSS-based design templates for typography, forms, buttons, navigation and other interface components, as well as optional JavaScript extensions. It aims to ease the development of dynamic websites and web applications. Bootstrap is a front end web framework, that is, an interface for the user, unlike the server-side code which resides on the "back end" or server.