Bootstrap CDN- Fixing the Dropdown Issue

Bootstrap CDN is a convenient way  to explore the functionalities of Bootstrap without the hassle of downloading and saving it to your local server. All you would have to do is paste some script tags on the header of your HTML page that would link to the files in the Bootstrap Server.

As I write this blog, the latest Version of Bootstrap is v4.0.0-alpha. You can find the script tags to Include on your page over here.

The script tags that you are Including would compile Bootstrap CSS and JavaScript to your project


Screen Shot 2017-08-27 at 3.29.39 PM

Be aware that once you are using features like DropDowns, they won’t work. The reason being that Dropdowns require JQuery and that is not normally given with the CDN. You would have to explicitly specify a script tag to compile JQuery. And make sure that is the first tag that you put on your header tag before the Bootstrap script tags.

Your header should eventually look something like this-

Screen Shot 2017-08-27 at 3.35.01 PM

As you can see the first tag is JQuery followed by Bootstrap CSS and Javascript.


Once you have this on your header , the dropdowns should work 🙂