bootstrap-4

问题 Ok so I have to admit this is something I have always struggled with getting to work correctly even in BS3. But I want to have navbar links outside of the collapsed container that stay persistent. This is what I have right now: <nav class="navbar fixed-top navbar-expand-lg navbar-template"> <a class="navbar-brand" href="#">Navbar</a> <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNavDropdown"> <span class="navbar-toggler-icon"></span> </button> <div

问题 I have a simple bootstrap grid layout. I do not want the columns to stack vertically even on small devices. <div class="container"> <div class="row"> <div class="col-sm-4 col-xs-4 col-md-4">1</div> <div class="col-sm-4 col-xs-4 col-md-4">2</div> <div class="col-sm-4 col-xs-4 col-md-4">3</div> </div> 回答1: The columns are stacking vertically because you're using Bootstrap 4 , and the -xs- infix is no longer used. Just use col-4 .. <div class="container border-show center-div"> <div class="row">

问题 I have a bootstrap website where the Hamburger is added when the screen is less than 992px. The HamBurger code is like so <button class="navbar-toggler navbar-toggler-right" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation"> <span class="navbar-toggler-icon"></span> </button> Is there any possibility to change the color of the HamBurger button? 回答1: The navbar-toggler-icon

问题 I am trying to implement a Navbar using Bootstrap 4. Currently, the Navbar correctly collapses when the viewport is shrunk to mobile size. However, when attempting to toggle menu, nothing happens. The jsFiddle example demonstrates this behavior. I have attached the HTML as well. Steps I have taken: Removing all custom CSS Ensuring jQuery link is before Bootstrap JS file Script tags in the header and the footer Copy and paste exact examples from Bootstrap Docs (and I get the same behavior)

问题 I've created this collapsable navbar using Bootstrap 4 that works nicely, but I would like it to close when the user clicks on a link. Any way to do this? Thanks html navbar: <nav class="navbar navbar-toggleable-md fixed-top"> <button id="nav-btn"class="navbar-toggler navbar-toggler-right" type="button" data-toggle="collapse" data-target="#navbarDiv" aria-expanded="false" aria-label="Toggle navigation"> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"><

问题 I've created this collapsable navbar using Bootstrap 4 that works nicely, but I would like it to close when the user clicks on a link. Any way to do this? Thanks html navbar: <nav class="navbar navbar-toggleable-md fixed-top"> <button id="nav-btn"class="navbar-toggler navbar-toggler-right" type="button" data-toggle="collapse" data-target="#navbarDiv" aria-expanded="false" aria-label="Toggle navigation"> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"><

问题 This question already has an answer here : Bootstrap 4.0 Grid System Layout not working (1 answer) Closed last year . im migrating to bootstrap 4 however Ive swapped the boostrap-min.css for my pages from 3 to 4 and my columns are all now vertically aligned as as far as I can see the columns are correct. I also used a JS fiddle to test and am able to repliate them all being vertical there too. can anyone point me in the right direction, from how ive read the documentation https://getbootstrap

问题 In Bootstrap 3 , I could apply col-sm-xx to the th tags in the thead and resize table columns at will. However this doesn't work in bootstrap 4. How can I achieve something like this in bootstrap 4? <thead> <th class="col-sm-3">3 columns wide</th> <th class="col-sm-5">5 columns wide</th> <th class="col-sm-4">4 columns wide</th> </thead> Looking at the codeply provided it doesn't size properly, especially if you add some data to the table. See how this runs: <div class="container" style=

问题 is there a way to disable the responsive navBar in bootstrap 4? I don't want the dropdown as in the mobile version it's still possible to see the 2 links next to the brand. As a plus, I'd like to know if it's possible to put the links to the right in the bar. Pull-xs-right doesn't seem to work correctly. My current code looks like this: <nav class="navbar navbar-fixed-top navbar-toggleable-sm navbar-light bg-faded"> <a href="/" class="navbar-brand">PIM</a> <ul class="nav navbar-nav pull-xs

问题 The default Bootstrap grid system utilizes 12 columns with each span having 30px gutter as below. Gutters are the white space between columns. Gutter width seems to be between 20px - 30px . Let's assume it's 30px here. I want to remove the gutter space for a specific div , so that there will be no gutter space in the row. Each span will be next to each other with no gutter. The problem is if I remove the margin 30px (gutter) it leaves 360px (12 * 30px ) at the end of the row. Given that I