Bootstrap is only working with external links, not with the downloaded version











up vote
-1
down vote

favorite












When I use Bootstrap with external links, e.g.



<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>


it is working. But when I download Bootstrap and jQuery and link it within my folders like this:



<link rel="stylesheet" type="text/css" media="screen" href="./css/bootstrap.min.css" />
<link rel="stylesheet" type="text/css" media="screen" href="./css/myStyle.css" />
<script src="./js/bootstrap.min.js"></script>
<script src="./js/jquery.min.js"></script>


it is not working. The links are correct, "myStyle.css" is working fine and I double-checked the links and names.



My folder structure:



index.html
/css/all the bootstrap .css files
/js/all the bootstrap + jquery js files


What am I doing wrong?










share|improve this question









New contributor




Mievo is a new contributor to this site. Take care in asking for clarification, commenting, and answering.
Check out our Code of Conduct.




















  • Are there any JS errors you see in the console? Just a wild guess, can you put your script tag for JQuery first and then the bootstrap script tag?
    – Gurtej Singh
    Nov 20 at 22:14






  • 4




    That's not a wild guess. Must be ordered that way. jQuery.js has to load before any other plugins or code that depends on it
    – charlietfl
    Nov 20 at 22:16












  • Sounds improbable. Are you sure the folder is /js/ and is at the same level as /css/? If you load the resulting link in the browser, does it show the js file contents? Do you have any wild .htaccess rules? Any errors in console? All of your tags are wrong. You don't experts on any of the listed technologies. You need expert on whatever technology your server is running on: apache, apache-config or mabye httpserver. Perhaps unix or windows-server?
    – Andrei Gheorghiu
    Nov 20 at 22:17












  • What's the path of the current page? Also, check network in dev tools to see if you're getting 404s. Check to see how the page is actually loading those relative paths.
    – Joseph
    Nov 20 at 22:19












  • just remove dot(. before the URL and also while running chrome check what the source url is generated ,so can you can solve that)
    – Yash Soni
    Nov 21 at 7:53















up vote
-1
down vote

favorite












When I use Bootstrap with external links, e.g.



<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>


it is working. But when I download Bootstrap and jQuery and link it within my folders like this:



<link rel="stylesheet" type="text/css" media="screen" href="./css/bootstrap.min.css" />
<link rel="stylesheet" type="text/css" media="screen" href="./css/myStyle.css" />
<script src="./js/bootstrap.min.js"></script>
<script src="./js/jquery.min.js"></script>


it is not working. The links are correct, "myStyle.css" is working fine and I double-checked the links and names.



My folder structure:



index.html
/css/all the bootstrap .css files
/js/all the bootstrap + jquery js files


What am I doing wrong?










share|improve this question









New contributor




Mievo is a new contributor to this site. Take care in asking for clarification, commenting, and answering.
Check out our Code of Conduct.




















  • Are there any JS errors you see in the console? Just a wild guess, can you put your script tag for JQuery first and then the bootstrap script tag?
    – Gurtej Singh
    Nov 20 at 22:14






  • 4




    That's not a wild guess. Must be ordered that way. jQuery.js has to load before any other plugins or code that depends on it
    – charlietfl
    Nov 20 at 22:16












  • Sounds improbable. Are you sure the folder is /js/ and is at the same level as /css/? If you load the resulting link in the browser, does it show the js file contents? Do you have any wild .htaccess rules? Any errors in console? All of your tags are wrong. You don't experts on any of the listed technologies. You need expert on whatever technology your server is running on: apache, apache-config or mabye httpserver. Perhaps unix or windows-server?
    – Andrei Gheorghiu
    Nov 20 at 22:17












  • What's the path of the current page? Also, check network in dev tools to see if you're getting 404s. Check to see how the page is actually loading those relative paths.
    – Joseph
    Nov 20 at 22:19












  • just remove dot(. before the URL and also while running chrome check what the source url is generated ,so can you can solve that)
    – Yash Soni
    Nov 21 at 7:53













up vote
-1
down vote

favorite









up vote
-1
down vote

favorite











When I use Bootstrap with external links, e.g.



<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>


it is working. But when I download Bootstrap and jQuery and link it within my folders like this:



<link rel="stylesheet" type="text/css" media="screen" href="./css/bootstrap.min.css" />
<link rel="stylesheet" type="text/css" media="screen" href="./css/myStyle.css" />
<script src="./js/bootstrap.min.js"></script>
<script src="./js/jquery.min.js"></script>


it is not working. The links are correct, "myStyle.css" is working fine and I double-checked the links and names.



My folder structure:



index.html
/css/all the bootstrap .css files
/js/all the bootstrap + jquery js files


What am I doing wrong?










share|improve this question









New contributor




Mievo is a new contributor to this site. Take care in asking for clarification, commenting, and answering.
Check out our Code of Conduct.











When I use Bootstrap with external links, e.g.



<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>


it is working. But when I download Bootstrap and jQuery and link it within my folders like this:



<link rel="stylesheet" type="text/css" media="screen" href="./css/bootstrap.min.css" />
<link rel="stylesheet" type="text/css" media="screen" href="./css/myStyle.css" />
<script src="./js/bootstrap.min.js"></script>
<script src="./js/jquery.min.js"></script>


it is not working. The links are correct, "myStyle.css" is working fine and I double-checked the links and names.



My folder structure:



index.html
/css/all the bootstrap .css files
/js/all the bootstrap + jquery js files


What am I doing wrong?







javascript jquery css bootstrap-4






share|improve this question









New contributor




Mievo is a new contributor to this site. Take care in asking for clarification, commenting, and answering.
Check out our Code of Conduct.











share|improve this question









New contributor




Mievo is a new contributor to this site. Take care in asking for clarification, commenting, and answering.
Check out our Code of Conduct.









share|improve this question




share|improve this question








edited Nov 22 at 9:20









Paolo Forgia

4,37962644




4,37962644






New contributor




Mievo is a new contributor to this site. Take care in asking for clarification, commenting, and answering.
Check out our Code of Conduct.









asked Nov 20 at 22:11









Mievo

4




4




New contributor




Mievo is a new contributor to this site. Take care in asking for clarification, commenting, and answering.
Check out our Code of Conduct.





New contributor





Mievo is a new contributor to this site. Take care in asking for clarification, commenting, and answering.
Check out our Code of Conduct.






Mievo is a new contributor to this site. Take care in asking for clarification, commenting, and answering.
Check out our Code of Conduct.












  • Are there any JS errors you see in the console? Just a wild guess, can you put your script tag for JQuery first and then the bootstrap script tag?
    – Gurtej Singh
    Nov 20 at 22:14






  • 4




    That's not a wild guess. Must be ordered that way. jQuery.js has to load before any other plugins or code that depends on it
    – charlietfl
    Nov 20 at 22:16












  • Sounds improbable. Are you sure the folder is /js/ and is at the same level as /css/? If you load the resulting link in the browser, does it show the js file contents? Do you have any wild .htaccess rules? Any errors in console? All of your tags are wrong. You don't experts on any of the listed technologies. You need expert on whatever technology your server is running on: apache, apache-config or mabye httpserver. Perhaps unix or windows-server?
    – Andrei Gheorghiu
    Nov 20 at 22:17












  • What's the path of the current page? Also, check network in dev tools to see if you're getting 404s. Check to see how the page is actually loading those relative paths.
    – Joseph
    Nov 20 at 22:19












  • just remove dot(. before the URL and also while running chrome check what the source url is generated ,so can you can solve that)
    – Yash Soni
    Nov 21 at 7:53


















  • Are there any JS errors you see in the console? Just a wild guess, can you put your script tag for JQuery first and then the bootstrap script tag?
    – Gurtej Singh
    Nov 20 at 22:14






  • 4




    That's not a wild guess. Must be ordered that way. jQuery.js has to load before any other plugins or code that depends on it
    – charlietfl
    Nov 20 at 22:16












  • Sounds improbable. Are you sure the folder is /js/ and is at the same level as /css/? If you load the resulting link in the browser, does it show the js file contents? Do you have any wild .htaccess rules? Any errors in console? All of your tags are wrong. You don't experts on any of the listed technologies. You need expert on whatever technology your server is running on: apache, apache-config or mabye httpserver. Perhaps unix or windows-server?
    – Andrei Gheorghiu
    Nov 20 at 22:17












  • What's the path of the current page? Also, check network in dev tools to see if you're getting 404s. Check to see how the page is actually loading those relative paths.
    – Joseph
    Nov 20 at 22:19












  • just remove dot(. before the URL and also while running chrome check what the source url is generated ,so can you can solve that)
    – Yash Soni
    Nov 21 at 7:53
















Are there any JS errors you see in the console? Just a wild guess, can you put your script tag for JQuery first and then the bootstrap script tag?
– Gurtej Singh
Nov 20 at 22:14




Are there any JS errors you see in the console? Just a wild guess, can you put your script tag for JQuery first and then the bootstrap script tag?
– Gurtej Singh
Nov 20 at 22:14




4




4




That's not a wild guess. Must be ordered that way. jQuery.js has to load before any other plugins or code that depends on it
– charlietfl
Nov 20 at 22:16






That's not a wild guess. Must be ordered that way. jQuery.js has to load before any other plugins or code that depends on it
– charlietfl
Nov 20 at 22:16














Sounds improbable. Are you sure the folder is /js/ and is at the same level as /css/? If you load the resulting link in the browser, does it show the js file contents? Do you have any wild .htaccess rules? Any errors in console? All of your tags are wrong. You don't experts on any of the listed technologies. You need expert on whatever technology your server is running on: apache, apache-config or mabye httpserver. Perhaps unix or windows-server?
– Andrei Gheorghiu
Nov 20 at 22:17






Sounds improbable. Are you sure the folder is /js/ and is at the same level as /css/? If you load the resulting link in the browser, does it show the js file contents? Do you have any wild .htaccess rules? Any errors in console? All of your tags are wrong. You don't experts on any of the listed technologies. You need expert on whatever technology your server is running on: apache, apache-config or mabye httpserver. Perhaps unix or windows-server?
– Andrei Gheorghiu
Nov 20 at 22:17














What's the path of the current page? Also, check network in dev tools to see if you're getting 404s. Check to see how the page is actually loading those relative paths.
– Joseph
Nov 20 at 22:19






What's the path of the current page? Also, check network in dev tools to see if you're getting 404s. Check to see how the page is actually loading those relative paths.
– Joseph
Nov 20 at 22:19














just remove dot(. before the URL and also while running chrome check what the source url is generated ,so can you can solve that)
– Yash Soni
Nov 21 at 7:53




just remove dot(. before the URL and also while running chrome check what the source url is generated ,so can you can solve that)
– Yash Soni
Nov 21 at 7:53












2 Answers
2






active

oldest

votes

















up vote
0
down vote













you need to add jQuery before bootstrap.min.js



<link rel="stylesheet" type="text/css" media="screen" href="css/bootstrap.min.css" />
<link rel="stylesheet" type="text/css" media="screen" href="css/myStyle.css" />
<script src="js/jquery.min.js"></script>
<script src="js/bootstrap.min.js"></script>





share|improve this answer




























    up vote
    -1
    down vote













    <link rel="stylesheet" type="text/css" media="screen" href="css/bootstrap.min.css" />
    <link rel="stylesheet" type="text/css" media="screen" href="css/myStyle.css" />
    <script src="js/bootstrap.min.js"></script>
    <script src="js/jquery.min.js"></script>





    share|improve this answer








    New contributor




    Cyril Marvin Raña is a new contributor to this site. Take care in asking for clarification, commenting, and answering.
    Check out our Code of Conduct.














    • 4




      it would be better if you added an explanation to the answer.
      – Germano Plebani
      Nov 21 at 8:13











    Your Answer






    StackExchange.ifUsing("editor", function () {
    StackExchange.using("externalEditor", function () {
    StackExchange.using("snippets", function () {
    StackExchange.snippets.init();
    });
    });
    }, "code-snippets");

    StackExchange.ready(function() {
    var channelOptions = {
    tags: "".split(" "),
    id: "1"
    };
    initTagRenderer("".split(" "), "".split(" "), channelOptions);

    StackExchange.using("externalEditor", function() {
    // Have to fire editor after snippets, if snippets enabled
    if (StackExchange.settings.snippets.snippetsEnabled) {
    StackExchange.using("snippets", function() {
    createEditor();
    });
    }
    else {
    createEditor();
    }
    });

    function createEditor() {
    StackExchange.prepareEditor({
    heartbeatType: 'answer',
    convertImagesToLinks: true,
    noModals: true,
    showLowRepImageUploadWarning: true,
    reputationToPostImages: 10,
    bindNavPrevention: true,
    postfix: "",
    imageUploader: {
    brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
    contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
    allowUrls: true
    },
    onDemand: true,
    discardSelector: ".discard-answer"
    ,immediatelyShowMarkdownHelp:true
    });


    }
    });






    Mievo is a new contributor. Be nice, and check out our Code of Conduct.










     

    draft saved


    draft discarded


















    StackExchange.ready(
    function () {
    StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53402375%2fbootstrap-is-only-working-with-external-links-not-with-the-downloaded-version%23new-answer', 'question_page');
    }
    );

    Post as a guest















    Required, but never shown

























    2 Answers
    2






    active

    oldest

    votes








    2 Answers
    2






    active

    oldest

    votes









    active

    oldest

    votes






    active

    oldest

    votes








    up vote
    0
    down vote













    you need to add jQuery before bootstrap.min.js



    <link rel="stylesheet" type="text/css" media="screen" href="css/bootstrap.min.css" />
    <link rel="stylesheet" type="text/css" media="screen" href="css/myStyle.css" />
    <script src="js/jquery.min.js"></script>
    <script src="js/bootstrap.min.js"></script>





    share|improve this answer

























      up vote
      0
      down vote













      you need to add jQuery before bootstrap.min.js



      <link rel="stylesheet" type="text/css" media="screen" href="css/bootstrap.min.css" />
      <link rel="stylesheet" type="text/css" media="screen" href="css/myStyle.css" />
      <script src="js/jquery.min.js"></script>
      <script src="js/bootstrap.min.js"></script>





      share|improve this answer























        up vote
        0
        down vote










        up vote
        0
        down vote









        you need to add jQuery before bootstrap.min.js



        <link rel="stylesheet" type="text/css" media="screen" href="css/bootstrap.min.css" />
        <link rel="stylesheet" type="text/css" media="screen" href="css/myStyle.css" />
        <script src="js/jquery.min.js"></script>
        <script src="js/bootstrap.min.js"></script>





        share|improve this answer












        you need to add jQuery before bootstrap.min.js



        <link rel="stylesheet" type="text/css" media="screen" href="css/bootstrap.min.css" />
        <link rel="stylesheet" type="text/css" media="screen" href="css/myStyle.css" />
        <script src="js/jquery.min.js"></script>
        <script src="js/bootstrap.min.js"></script>






        share|improve this answer












        share|improve this answer



        share|improve this answer










        answered Nov 22 at 9:51









        Saurabh Mistry

        2,7791726




        2,7791726
























            up vote
            -1
            down vote













            <link rel="stylesheet" type="text/css" media="screen" href="css/bootstrap.min.css" />
            <link rel="stylesheet" type="text/css" media="screen" href="css/myStyle.css" />
            <script src="js/bootstrap.min.js"></script>
            <script src="js/jquery.min.js"></script>





            share|improve this answer








            New contributor




            Cyril Marvin Raña is a new contributor to this site. Take care in asking for clarification, commenting, and answering.
            Check out our Code of Conduct.














            • 4




              it would be better if you added an explanation to the answer.
              – Germano Plebani
              Nov 21 at 8:13















            up vote
            -1
            down vote













            <link rel="stylesheet" type="text/css" media="screen" href="css/bootstrap.min.css" />
            <link rel="stylesheet" type="text/css" media="screen" href="css/myStyle.css" />
            <script src="js/bootstrap.min.js"></script>
            <script src="js/jquery.min.js"></script>





            share|improve this answer








            New contributor




            Cyril Marvin Raña is a new contributor to this site. Take care in asking for clarification, commenting, and answering.
            Check out our Code of Conduct.














            • 4




              it would be better if you added an explanation to the answer.
              – Germano Plebani
              Nov 21 at 8:13













            up vote
            -1
            down vote










            up vote
            -1
            down vote









            <link rel="stylesheet" type="text/css" media="screen" href="css/bootstrap.min.css" />
            <link rel="stylesheet" type="text/css" media="screen" href="css/myStyle.css" />
            <script src="js/bootstrap.min.js"></script>
            <script src="js/jquery.min.js"></script>





            share|improve this answer








            New contributor




            Cyril Marvin Raña is a new contributor to this site. Take care in asking for clarification, commenting, and answering.
            Check out our Code of Conduct.









            <link rel="stylesheet" type="text/css" media="screen" href="css/bootstrap.min.css" />
            <link rel="stylesheet" type="text/css" media="screen" href="css/myStyle.css" />
            <script src="js/bootstrap.min.js"></script>
            <script src="js/jquery.min.js"></script>






            share|improve this answer








            New contributor




            Cyril Marvin Raña is a new contributor to this site. Take care in asking for clarification, commenting, and answering.
            Check out our Code of Conduct.









            share|improve this answer



            share|improve this answer






            New contributor




            Cyril Marvin Raña is a new contributor to this site. Take care in asking for clarification, commenting, and answering.
            Check out our Code of Conduct.









            answered Nov 21 at 6:05









            Cyril Marvin Raña

            11




            11




            New contributor




            Cyril Marvin Raña is a new contributor to this site. Take care in asking for clarification, commenting, and answering.
            Check out our Code of Conduct.





            New contributor





            Cyril Marvin Raña is a new contributor to this site. Take care in asking for clarification, commenting, and answering.
            Check out our Code of Conduct.






            Cyril Marvin Raña is a new contributor to this site. Take care in asking for clarification, commenting, and answering.
            Check out our Code of Conduct.








            • 4




              it would be better if you added an explanation to the answer.
              – Germano Plebani
              Nov 21 at 8:13














            • 4




              it would be better if you added an explanation to the answer.
              – Germano Plebani
              Nov 21 at 8:13








            4




            4




            it would be better if you added an explanation to the answer.
            – Germano Plebani
            Nov 21 at 8:13




            it would be better if you added an explanation to the answer.
            – Germano Plebani
            Nov 21 at 8:13










            Mievo is a new contributor. Be nice, and check out our Code of Conduct.










             

            draft saved


            draft discarded


















            Mievo is a new contributor. Be nice, and check out our Code of Conduct.













            Mievo is a new contributor. Be nice, and check out our Code of Conduct.












            Mievo is a new contributor. Be nice, and check out our Code of Conduct.















             


            draft saved


            draft discarded














            StackExchange.ready(
            function () {
            StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53402375%2fbootstrap-is-only-working-with-external-links-not-with-the-downloaded-version%23new-answer', 'question_page');
            }
            );

            Post as a guest















            Required, but never shown





















































            Required, but never shown














            Required, but never shown












            Required, but never shown







            Required, but never shown

































            Required, but never shown














            Required, but never shown












            Required, but never shown







            Required, but never shown







            Popular posts from this blog

            What visual should I use to simply compare current year value vs last year in Power BI desktop

            How to ignore python UserWarning in pytest?

            Alexandru Averescu