Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 9 of 9
  1. #1
    New Coder
    Join Date
    Oct 2016
    Posts
    30
    Thanks
    5
    Thanked 0 Times in 0 Posts

    Dropdown menu items not working in Bootstrap page

    This is the first day I'm learning Bootstrap. When I copy/paste a page
    from the Bootstrap website and make a few minor obvious modifications (as described
    below), in the browser I get an identical page except that the dropdown menus
    don't work, and I am unable so far to understand why they don't work.

    The items that should drop down on hover (as they do on the original Bootstrap page)
    simply behave as links.

    This does not seem to be a browser issue, as I get an identical behavior with
    Firefox, Safari or Google Chrome (recent versions) on my Mac 10.11.3.

    Here is precisely what I did :


    1) Copy/paste the HTML source for Navbar Template for Bootstrap
    into my website's index.html file.
    2) For each passage in the code who uses a relative URL with ""../../../../",
    I put a copy of the file referred to in my website's root directory, and change
    the link code to point to my copy (the only exception to that is
    "../../../../assets/js/vendor/jquery.min.js" at line 342, because I do not have access
    to that file, but that piece of code is normally not called).

    Any help appreciated.

  2. #2
    Regular Coder
    Join Date
    Jun 2008
    Posts
    279
    Thanks
    4
    Thanked 21 Times in 21 Posts
    Show me your page. Can't scry.
    I never ever read PM's unless it's an job offer. So save your time for regular questions in the forum. I never ever take friendship offers. We are not on facebook here.(It's stupid on facebook too). Friendship? Do i know you? Did we ever had a beer together? Thats really stupid. Sorry.

  3. #3
    New Coder
    Join Date
    Oct 2016
    Posts
    30
    Thanks
    5
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by Labrar View Post
    Show me your page. Can't scry.
    Right clicking on the link should do it. But since you ask, here it goes (the included bootstrap.css and bootstrap.js would be rather difficult to repoduce here, as combined they make about 10 times the size limit in number of chars for a message here) :

    Contents of index.html file :

    Code:
    <!DOCTYPE html>
    <html lang="en">
      <head>
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
        <meta name="description" content="">
        <meta name="author" content="">
        <link rel="icon" href="images/favicon.ico">
    
        <title>Navbar Template for Bootstrap</title>
    
        <!-- Bootstrap core CSS -->
        <link href="css/bootstrap.min.css" rel="stylesheet">
    
        <!-- Custom styles for this template -->
        <link href="css/navbar.css" rel="stylesheet">
      </head>
    
      <body>
    
        <nav class="navbar navbar-dark bg-dark">
          <a class="navbar-brand" href="#">Never expand</a>
          <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarsExample01" aria-controls="navbarsExample01" aria-expanded="false" aria-label="Toggle navigation">
            <span class="navbar-toggler-icon"></span>
          </button>
    
          <div class="collapse navbar-collapse" id="navbarsExample01">
            <ul class="navbar-nav mr-auto">
              <li class="nav-item active">
                <a class="nav-link" href="#">Home <span class="sr-only">(current)</span></a>
              </li>
              <li class="nav-item">
                <a class="nav-link" href="#">Link</a>
              </li>
              <li class="nav-item">
                <a class="nav-link disabled" href="#">Disabled</a>
              </li>
              <li class="nav-item dropdown">
                <a class="nav-link dropdown-toggle"  id="dropdown01" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">Dropdown</a>
                <div class="dropdown-menu" aria-labelledby="dropdown01">
                  <a class="dropdown-item" href="#">Action</a>
                  <a class="dropdown-item" href="#">Another action</a>
                  <a class="dropdown-item" href="#">Something else here</a>
                </div>
              </li>
            </ul>
            <form class="form-inline my-2 my-md-0">
              <input class="form-control" type="text" placeholder="Search" aria-label="Search">
            </form>
          </div>
        </nav>
    
        <nav class="navbar navbar-expand navbar-dark bg-dark">
          <a class="navbar-brand" href="#">Always expand</a>
          <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarsExample02" aria-controls="navbarsExample02" aria-expanded="false" aria-label="Toggle navigation">
            <span class="navbar-toggler-icon"></span>
          </button>
    
          <div class="collapse navbar-collapse" id="navbarsExample02">
            <ul class="navbar-nav mr-auto">
              <li class="nav-item active">
                <a class="nav-link" href="#">Home <span class="sr-only">(current)</span></a>
              </li>
              <li class="nav-item">
                <a class="nav-link" href="#">Link</a>
              </li>
            </ul>
            <form class="form-inline my-2 my-md-0">
              <input class="form-control" type="text" placeholder="Search">
            </form>
          </div>
        </nav>
    
        <nav class="navbar navbar-expand-sm navbar-dark bg-dark">
          <a class="navbar-brand" href="#">Expand at sm</a>
          <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarsExample03" aria-controls="navbarsExample03" aria-expanded="false" aria-label="Toggle navigation">
            <span class="navbar-toggler-icon"></span>
          </button>
    
          <div class="collapse navbar-collapse" id="navbarsExample03">
            <ul class="navbar-nav mr-auto">
              <li class="nav-item active">
                <a class="nav-link" href="#">Home <span class="sr-only">(current)</span></a>
              </li>
              <li class="nav-item">
                <a class="nav-link" href="#">Link</a>
              </li>
              <li class="nav-item">
                <a class="nav-link disabled" href="#">Disabled</a>
              </li>
              <li class="nav-item dropdown">
                <a class="nav-link dropdown-toggle" href="http://example.com" id="dropdown03" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">Dropdown</a>
                <div class="dropdown-menu" aria-labelledby="dropdown03">
                  <a class="dropdown-item" href="#">Action</a>
                  <a class="dropdown-item" href="#">Another action</a>
                  <a class="dropdown-item" href="#">Something else here</a>
                </div>
              </li>
            </ul>
            <form class="form-inline my-2 my-md-0">
              <input class="form-control" type="text" placeholder="Search">
            </form>
          </div>
        </nav>
    
        <nav class="navbar navbar-expand-md navbar-dark bg-dark">
          <a class="navbar-brand" href="#">Expand at md</a>
          <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarsExample04" aria-controls="navbarsExample04" aria-expanded="false" aria-label="Toggle navigation">
            <span class="navbar-toggler-icon"></span>
          </button>
    
          <div class="collapse navbar-collapse" id="navbarsExample04">
            <ul class="navbar-nav mr-auto">
              <li class="nav-item active">
                <a class="nav-link" href="#">Home <span class="sr-only">(current)</span></a>
              </li>
              <li class="nav-item">
                <a class="nav-link" href="#">Link</a>
              </li>
              <li class="nav-item">
                <a class="nav-link disabled" href="#">Disabled</a>
              </li>
              <li class="nav-item dropdown">
                <a class="nav-link dropdown-toggle" href="http://example.com" id="dropdown04" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">Dropdown</a>
                <div class="dropdown-menu" aria-labelledby="dropdown04">
                  <a class="dropdown-item" href="#">Action</a>
                  <a class="dropdown-item" href="#">Another action</a>
                  <a class="dropdown-item" href="#">Something else here</a>
                </div>
              </li>
            </ul>
            <form class="form-inline my-2 my-md-0">
              <input class="form-control" type="text" placeholder="Search">
            </form>
          </div>
        </nav>
    
        <nav class="navbar navbar-expand-lg navbar-dark bg-dark">
          <a class="navbar-brand" href="#">Expand at lg</a>
          <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarsExample05" aria-controls="navbarsExample05" aria-expanded="false" aria-label="Toggle navigation">
            <span class="navbar-toggler-icon"></span>
          </button>
    
          <div class="collapse navbar-collapse" id="navbarsExample05">
            <ul class="navbar-nav mr-auto">
              <li class="nav-item active">
                <a class="nav-link" href="#">Home <span class="sr-only">(current)</span></a>
              </li>
              <li class="nav-item">
                <a class="nav-link" href="#">Link</a>
              </li>
              <li class="nav-item">
                <a class="nav-link disabled" href="#">Disabled</a>
              </li>
              <li class="nav-item dropdown">
                <a class="nav-link dropdown-toggle" href="http://example.com" id="dropdown05" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">Dropdown</a>
                <div class="dropdown-menu" aria-labelledby="dropdown05">
                  <a class="dropdown-item" href="#">Action</a>
                  <a class="dropdown-item" href="#">Another action</a>
                  <a class="dropdown-item" href="#">Something else here</a>
                </div>
              </li>
            </ul>
            <form class="form-inline my-2 my-md-0">
              <input class="form-control" type="text" placeholder="Search">
            </form>
          </div>
        </nav>
    
        <nav class="navbar navbar-expand-xl navbar-dark bg-dark">
          <a class="navbar-brand" href="#">Expand at xl</a>
          <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarsExample06" aria-controls="navbarsExample06" aria-expanded="false" aria-label="Toggle navigation">
            <span class="navbar-toggler-icon"></span>
          </button>
    
          <div class="collapse navbar-collapse" id="navbarsExample06">
            <ul class="navbar-nav mr-auto">
              <li class="nav-item active">
                <a class="nav-link" href="#">Home <span class="sr-only">(current)</span></a>
              </li>
              <li class="nav-item">
                <a class="nav-link" href="#">Link</a>
              </li>
              <li class="nav-item">
                <a class="nav-link disabled" href="#">Disabled</a>
              </li>
              <li class="nav-item dropdown">
                <a class="nav-link dropdown-toggle" id="dropdown06" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">Dropdown</a>
                <div class="dropdown-menu" aria-labelledby="dropdown06">
                  <a class="dropdown-item" href="#">Action</a>
                  <a class="dropdown-item" href="#">Another action</a>
                  <a class="dropdown-item" href="#">Something else here</a>
                </div>
              </li>
            </ul>
            <form class="form-inline my-2 my-md-0">
              <input class="form-control" type="text" placeholder="Search">
            </form>
          </div>
        </nav>
    
        <nav class="navbar navbar-expand-lg navbar-dark bg-dark">
          <div class="container">
            <a class="navbar-brand" href="#">Container</a>
            <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarsExample07" aria-controls="navbarsExample07" aria-expanded="false" aria-label="Toggle navigation">
              <span class="navbar-toggler-icon"></span>
            </button>
    
            <div class="collapse navbar-collapse" id="navbarsExample07">
              <ul class="navbar-nav mr-auto">
                <li class="nav-item active">
                  <a class="nav-link" href="#">Home <span class="sr-only">(current)</span></a>
                </li>
                <li class="nav-item">
                  <a class="nav-link" href="#">Link</a>
                </li>
                <li class="nav-item">
                  <a class="nav-link disabled" href="#">Disabled</a>
                </li>
                <li class="nav-item dropdown">
                  <a class="nav-link dropdown-toggle" href="http://example.com" id="dropdown07" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">Dropdown</a>
                  <div class="dropdown-menu" aria-labelledby="dropdown07">
                    <a class="dropdown-item" href="#">Action</a>
                    <a class="dropdown-item" href="#">Another action</a>
                    <a class="dropdown-item" href="#">Something else here</a>
                  </div>
                </li>
              </ul>
              <form class="form-inline my-2 my-md-0">
                <input class="form-control" type="text" placeholder="Search" aria-label="Search">
              </form>
            </div>
          </div>
        </nav>
    
        <nav class="navbar navbar-expand-lg navbar-dark bg-dark">
          <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarsExample08" aria-controls="navbarsExample08" aria-expanded="false" aria-label="Toggle navigation">
            <span class="navbar-toggler-icon"></span>
          </button>
    
          <div class="collapse navbar-collapse justify-content-md-center" id="navbarsExample08">
            <ul class="navbar-nav">
              <li class="nav-item active">
                <a class="nav-link" href="#">Centered nav only <span class="sr-only">(current)</span></a>
              </li>
              <li class="nav-item">
                <a class="nav-link" href="#">Link</a>
              </li>
              <li class="nav-item">
                <a class="nav-link disabled" href="#">Disabled</a>
              </li>
              <li class="nav-item dropdown">
                <a class="nav-link dropdown-toggle" href="http://example.com" id="dropdown08" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">Dropdown</a>
                <div class="dropdown-menu" aria-labelledby="dropdown08">
                  <a class="dropdown-item" href="#">Action</a>
                  <a class="dropdown-item" href="#">Another action</a>
                  <a class="dropdown-item" href="#">Something else here</a>
                </div>
              </li>
            </ul>
          </div>
        </nav>
    
        <div class="container">
          <nav class="navbar navbar-expand-lg navbar-light bg-light rounded">
            <a class="navbar-brand" href="#">Navbar</a>
            <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarsExample09" aria-controls="navbarsExample09" aria-expanded="false" aria-label="Toggle navigation">
              <span class="navbar-toggler-icon"></span>
            </button>
    
            <div class="collapse navbar-collapse" id="navbarsExample09">
              <ul class="navbar-nav mr-auto">
                <li class="nav-item active">
                  <a class="nav-link" href="#">Home <span class="sr-only">(current)</span></a>
                </li>
                <li class="nav-item">
                  <a class="nav-link" href="#">Link</a>
                </li>
                <li class="nav-item">
                  <a class="nav-link disabled" href="#">Disabled</a>
                </li>
                <li class="nav-item dropdown">
                  <a class="nav-link dropdown-toggle" href="http://example.com" id="dropdown09" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">Dropdown</a>
                  <div class="dropdown-menu" aria-labelledby="dropdown09">
                    <a class="dropdown-item" href="#">Action</a>
                    <a class="dropdown-item" href="#">Another action</a>
                    <a class="dropdown-item" href="#">Something else here</a>
                  </div>
                </li>
              </ul>
              <form class="form-inline my-2 my-md-0">
                <input class="form-control" type="text" placeholder="Search" aria-label="Search">
              </form>
            </div>
          </nav>
    
          <nav class="navbar navbar-expand-lg navbar-light bg-light rounded">
            <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarsExample10" aria-controls="navbarsExample10" aria-expanded="false" aria-label="Toggle navigation">
              <span class="navbar-toggler-icon"></span>
            </button>
    
            <div class="collapse navbar-collapse justify-content-md-center" id="navbarsExample10">
              <ul class="navbar-nav">
                <li class="nav-item active">
                  <a class="nav-link" href="#">Centered nav only <span class="sr-only">(current)</span></a>
                </li>
                <li class="nav-item">
                  <a class="nav-link" href="#">Link</a>
                </li>
                <li class="nav-item">
                  <a class="nav-link disabled" href="#">Disabled</a>
                </li>
                <li class="nav-item dropdown">
                  <a class="nav-link dropdown-toggle" href="http://example.com" id="dropdown10" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">Dropdown</a>
                  <div class="dropdown-menu" aria-labelledby="dropdown10">
                    <a class="dropdown-item" href="#">Action</a>
                    <a class="dropdown-item" href="#">Another action</a>
                    <a class="dropdown-item" href="#">Something else here</a>
                  </div>
                </li>
              </ul>
            </div>
          </nav>
    
          <div class="jumbotron">
            <div class="col-sm-8 mx-auto">
              <h1>Navbar examples</h1>
              <p>This example is a quick exercise to illustrate how the navbar and its contents work. Some navbars extend the width of the viewport, others are confined within a <code>.container</code>. For positioning of navbars, checkout the <a href="../navbar-top/">top</a> and <a href="../navbar-top-fixed/">fixed top</a> examples.</p>
              <p>At the smallest breakpoint, the collapse plugin is used to hide the links and show a menu button to toggle the collapsed content.</p>
              <p>
                <a class="btn btn-primary" href="../../components/navbar/" role="button">View navbar docs &raquo;</a>
              </p>
            </div>
          </div>
        </div>
    
    
        <!-- Bootstrap core JavaScript
        ================================================== -->
        <!-- Placed at the end of the document so the pages load faster -->
        <script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
        <script src="js/bootstrap.min.js"></script>
      </body>
    </html>

  4. #4
    Regular Coder
    Join Date
    Jun 2008
    Posts
    279
    Thanks
    4
    Thanked 21 Times in 21 Posts
    I've been asking for YOUR Domain. Not getbootstrap.com.
    Do you need help or not?

    I don't go through your pasted lines until my browser tools checked the origin.
    I never ever read PM's unless it's an job offer. So save your time for regular questions in the forum. I never ever take friendship offers. We are not on facebook here.(It's stupid on facebook too). Friendship? Do i know you? Did we ever had a beer together? Thats really stupid. Sorry.

  5. #5
    Senior Coder xelawho's Avatar
    Join Date
    Nov 2010
    Location
    Here
    Posts
    3,644
    Thanks
    58
    Thanked 662 Times in 657 Posts
    You can get jquery.min.js at a million places all over the net, most notably at the jquery cdn.
    If bootstrap relies on jquery (and it looks like it does, but I have no idea really) then not including it will surely kill your page's functionality.

    Insert discussion on graceful degradation and bloated frameworks here.

  6. #6
    New Coder
    Join Date
    Oct 2016
    Posts
    30
    Thanks
    5
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by Labrar View Post
    I've been asking for YOUR Domain. Not getbootstrap.com.
    Do you need help or not?

    I don't go through your pasted lines until my browser tools checked the origin.
    Sorry, I misunderstood you.
    The URL is Navbar Template for Bootstrap
    My web console shows me a lot of error messages but I didn't know what to make of it :

    Code:
    Unknown property ‘orphans’.  Declaration dropped.  bootstrap.min.css:6:349
    Unknown property ‘widows’.  Declaration dropped.  bootstrap.min.css:6:358
    Error in parsing value for ‘-webkit-text-size-adjust’.  Declaration dropped.  bootstrap.min.css:6:697
    Expected color but found ‘auto’.  Expected color but found ‘-webkit-focus-ring-color’.  Expected end of value but found ‘-webkit-focus-ring-color’.  Error in parsing value for ‘outline’.  Declaration dropped.  bootstrap.min.css:6:2848
    Unknown pseudo-class or pseudo-element ‘-webkit-inner-spin-button’.  Ruleset ignored due to bad selector.  bootstrap.min.css:6:3734
    Unknown pseudo-class or pseudo-element ‘-webkit-search-cancel-button’.  Ruleset ignored due to bad selector.  bootstrap.min.css:6:3886
    Unknown pseudo-class or pseudo-element ‘-webkit-file-upload-button’.  Ruleset ignored due to bad selector.  bootstrap.min.css:6:3982
    Error in parsing value for ‘display’.  Declaration dropped.  bootstrap.min.css:6:6629
    Unknown pseudo-class or pseudo-element ‘-ms-expand’.  Ruleset ignored due to bad selector.  bootstrap.min.css:6:18513
    Unknown pseudo-class or pseudo-element ‘-webkit-input-placeholder’.  Ruleset ignored due to bad selector.  bootstrap.min.css:6:18664
    Unknown pseudo-class or pseudo-element ‘-ms-input-placeholder’.  Ruleset ignored due to bad selector.  bootstrap.min.css:6:18728
    Unknown pseudo-class or pseudo-element ‘-ms-value’.  Ruleset ignored due to bad selector.  bootstrap.min.css:6:19009
    Error in parsing value for ‘display’.  Declaration dropped.  bootstrap.min.css:6:21161
    Error in parsing value for ‘display’.  Declaration dropped.  bootstrap.min.css:6:25220
    Error in parsing value for ‘display’.  Declaration dropped.  bootstrap.min.css:6:25416
    Error in parsing value for ‘display’.  Declaration dropped.  bootstrap.min.css:6:25575
    Error in parsing value for ‘display’.  Declaration dropped.  bootstrap.min.css:6:26011
    Error in parsing value for ‘display’.  Declaration dropped.  bootstrap.min.css:6:26340
    Unknown property ‘user-select’.  Declaration dropped.  bootstrap.min.css:6:26825
    Error in parsing value for ‘display’.  Declaration dropped.  bootstrap.min.css:6:37743
    Error in parsing value for ‘display’.  Declaration dropped.  bootstrap.min.css:6:38437
    Error in parsing value for ‘display’.  Declaration dropped.  bootstrap.min.css:6:39779
    Error in parsing value for ‘display’.  Declaration dropped.  bootstrap.min.css:6:41216
    Error in parsing value for ‘display’.  Declaration dropped.  bootstrap.min.css:6:41545
    Error in parsing value for ‘display’.  Declaration dropped.  bootstrap.min.css:6:44294
    Unknown property ‘user-select’.  Declaration dropped.  bootstrap.min.css:6:45084
    Error in parsing value for ‘display’.  Declaration dropped.  bootstrap.min.css:6:46149
    Unknown property ‘appearance’.  Declaration dropped.  bootstrap.min.css:6:46869
    Unknown pseudo-class or pseudo-element ‘-ms-value’.  Ruleset ignored due to bad selector.  bootstrap.min.css:6:46949
    Unknown pseudo-class or pseudo-element ‘-ms-expand’.  Ruleset ignored due to bad selector.  bootstrap.min.css:6:47074
    Unknown property ‘user-select’.  Declaration dropped.  bootstrap.min.css:6:47611
    Error in parsing value for ‘display’.  Declaration dropped.  bootstrap.min.css:6:48085
    Error in parsing value for ‘display’.  Declaration dropped.  bootstrap.min.css:6:49331
    Error in parsing value for ‘display’.  Declaration dropped.  bootstrap.min.css:6:49554
    Error in parsing value for ‘display’.  Declaration dropped.  bootstrap.min.css:6:49942
    Error in parsing value for ‘display’.  Declaration dropped.  bootstrap.min.css:6:51425
    Error in parsing value for ‘display’.  Declaration dropped.  bootstrap.min.css:6:52237
    Error in parsing value for ‘display’.  Declaration dropped.  bootstrap.min.css:6:53049
    Error in parsing value for ‘display’.  Declaration dropped.  bootstrap.min.css:6:53863
    Error in parsing value for ‘display’.  Declaration dropped.  bootstrap.min.css:6:54594
    Error in parsing value for ‘display’.  Declaration dropped.  bootstrap.min.css:6:56675
    Error in parsing value for ‘display’.  Declaration dropped.  bootstrap.min.css:6:58354
    Error in parsing value for ‘display’.  Declaration dropped.  bootstrap.min.css:6:58483
    Error in parsing value for ‘display’.  Declaration dropped.  bootstrap.min.css:6:58665
    Error in parsing value for ‘display’.  Declaration dropped.  bootstrap.min.css:6:60250
    Error in parsing value for ‘display’.  Declaration dropped.  bootstrap.min.css:6:65140
    Error in parsing value for ‘display’.  Declaration dropped.  bootstrap.min.css:6:65756
    Error in parsing value for ‘display’.  Declaration dropped.  bootstrap.min.css:6:65875
    Error in parsing value for ‘display’.  Declaration dropped.  bootstrap.min.css:6:71363
    Error in parsing value for ‘display’.  Declaration dropped.  bootstrap.min.css:6:71729
    Error in parsing value for ‘display’.  Declaration dropped.  bootstrap.min.css:6:72034
    Unknown property ‘line-break’.  Declaration dropped.  bootstrap.min.css:6:72924
    Unknown property ‘line-break’.  Declaration dropped.  bootstrap.min.css:6:75114
    Error in parsing value for ‘display’.  Declaration dropped.  bootstrap.min.css:6:80527
    Error in parsing value for ‘display’.  Declaration dropped.  bootstrap.min.css:6:81643
    Error in parsing value for ‘display’.  Declaration dropped.  bootstrap.min.css:6:85156
    Error in parsing value for ‘display’.  Declaration dropped.  bootstrap.min.css:6:85224
    Error in parsing value for ‘display’.  Declaration dropped.  bootstrap.min.css:6:85567
    Error in parsing value for ‘display’.  Declaration dropped.  bootstrap.min.css:6:85638
    Error in parsing value for ‘display’.  Declaration dropped.  bootstrap.min.css:6:85982
    Error in parsing value for ‘display’.  Declaration dropped.  bootstrap.min.css:6:86053
    Error in parsing value for ‘display’.  Declaration dropped.  bootstrap.min.css:6:86397
    Error in parsing value for ‘display’.  Declaration dropped.  bootstrap.min.css:6:86468
    Error in parsing value for ‘display’.  Declaration dropped.  bootstrap.min.css:6:86813
    Error in parsing value for ‘display’.  Declaration dropped.  bootstrap.min.css:6:86884
    Error in parsing value for ‘position’.  Declaration dropped.  bootstrap.min.css:6:101682
    Loading failed for the <script> with source “http://www.webexamples.tribunemicael.net/Bootstrap/js/bootstrap.min.js”.  index.html:342

  7. #7
    New Coder
    Join Date
    Oct 2016
    Posts
    30
    Thanks
    5
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by xelawho View Post
    You can get jquery.min.js at a million places all over the net, most notably at the jquery cdn.
    If bootstrap relies on jquery (and it looks like it does, but I have no idea really) then not including it will surely kill your page's functionality.
    But I think that's exactly what
    Code:
    <script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
    is doing (line 341 in my index.html file), isn't it ?

  8. #8
    New Coder
    Join Date
    Oct 2016
    Posts
    30
    Thanks
    5
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by xelawho View Post
    Insert discussion on graceful degradation and bloated frameworks here.
    I haven't read much on this forum yet, but I've already realized that this is a strong component of this forum's web programming philosohpy.
    But the point is that bloated frameworks are usually the price to pay for graceful degradation and responsiveness, isn't it ?
    I hate Bootstrap's weight, sure, but I'm grateful for its relieving me of the tedious and painstaking task of making my app responsive (that's if I can get it to work on my website )

  9. #9
    Senior Coder xelawho's Avatar
    Join Date
    Nov 2010
    Location
    Here
    Posts
    3,644
    Thanks
    58
    Thanked 662 Times in 657 Posts
    Quote Originally Posted by robertdawson View Post
    But the point is that bloated frameworks are usually the price to pay for graceful degradation and responsiveness, isn't it ?
    Just setting up my deckchair and preparing some popcorn...


 

Tags for this Thread

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •