twitter-bootstrap-4

Bootstrap 4 - Dropdowns only work one times with tabs menu

由 落花浮王杯 提交于 2019-12-23 17:31:01
问题 In bootstrap-4, the first time I click a dropdown in a tab menu it works fine, but after that it stops working. <!-- Nav tabs --> <ul class="nav nav-tabs" role="tablist"> <li class="nav-item"> <a class="nav-link active" href="#home" role="tab" data-toggle="tab">Home</a> </li> <li class="nav-item"> <a class="nav-link" href="#profile" role="tab" data-toggle="tab">Profile</a> </li> <li class="nav-item dropdown"> <a class="nav-link dropdown-toggle" data-toggle="dropdown" href="#" role="button"

Is no padding on `col` in Bootstrap 4 Grid System normal?

由 二次信任 提交于 2019-12-23 12:42:20
问题 I'm using Bootstrap v. 4 for the first time. I have a footer that is using the new flex col 's and it works great on desktop. But when I switch to mobile they're stacked so closely to each other there is no vertical margin / padding. Is this the normal behavior? Also, I would prefer the content is centered or at least have some offset. But using offset results in top padding instead of left or right offset. Is that normal behavior? If so, what would be the recommended, "official", approach to

Order and stack 3 columns with bootstrap 4

由 烈酒焚心 提交于 2019-12-23 10:57:32
问题 I have this structure in bootstrap columns: And I want you to change to a lower resolution, be ordered as follows: I found how to do it with flexbox here: Flexbox: reorder and stack columns But I can not change the entire structure of my project to flexbox, so I want to know if with bootstrap 4, it is possible to do so. Thank you very much. My poor test. @import url( 'https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.6/css/bootstrap.min.css' ); div { text-align: center; height: 60px; }

Order and stack 3 columns with bootstrap 4

由 為{幸葍}努か 提交于 2019-12-23 10:56:49
问题 I have this structure in bootstrap columns: And I want you to change to a lower resolution, be ordered as follows: I found how to do it with flexbox here: Flexbox: reorder and stack columns But I can not change the entire structure of my project to flexbox, so I want to know if with bootstrap 4, it is possible to do so. Thank you very much. My poor test. @import url( 'https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.6/css/bootstrap.min.css' ); div { text-align: center; height: 60px; }

Migrate to Bootstrap 4 from Bootstrap 3? [closed]

由 戏子无情 提交于 2019-12-23 10:04:19
问题 Closed . This question is opinion-based. It is not currently accepting answers. Want to improve this question? Update the question so it can be answered with facts and citations by editing this post. Closed 3 years ago . I am using bootstrap 3 in my project. I see that Bootstrap 4 is a major rewrite of almost the entire Bootstrap project. But is there any necessity to migrate to bootstrap 4 from 3? 回答1: To make your project a bit future-proof ! http://upgrade-bootstrap.bootply.com gives an

Change color of SVG background-image (Bootstrap 4 carousel)

由 家住魔仙堡 提交于 2019-12-22 12:07:56
问题 I have a BS 4 carousel with next/prev controls which works so far. I have a light background so I would like to change the color of the controls (currently white). HTML: <div id="carouselQuotes" class="carousel slide quotecaru" data-ride="carousel"> <ol class="carousel-indicators"> <li data-target="#carouselQuotes" data-slide-to="0" class="active"></li> <li data-target="#carouselQuotes" data-slide-to="1"></li> <li data-target="#carouselQuotes" data-slide-to="2"></li> </ol> <div class=

bootstrap navbar displays vertically instead of horizontally

由 為{幸葍}努か 提交于 2019-12-22 10:21:28
问题 On my page navbar appears vertically instead of horizontally. <!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 http-equiv="x-ua-compatible" content="ie=edge"> <title> Home | Bootstrap </title> <link rel="stylesheet" href="css/bootstrap.min.css"> </head> <body> <nav class="navbar navbar-light bg-faded"> <a class="navbar-brand" href="#">My bootstrap application</a> <ul class="nav navbar-nav

Bootstrap 4 - Right Align Navbar Items [duplicate]

由 ℡╲_俬逩灬. 提交于 2019-12-21 05:50:06
问题 This question already has answers here : Bootstrap 4 align navbar items to the right (20 answers) Closed 2 years ago . I'm trying to align my navbar items to the right in bootstrap 4 alpha 6. I'd like to have everything aligned right, except for the brand/title. This is what my code looks like: <nav class="navbar navbar-toggleable-md navbar-inverse bg-inverse"> <button class="navbar-toggler navbar-toggler-right" type="button" data-toggle="collapse" data-target="#navbarNavAltMarkup" aria

Do you need to use Bootstrap's “container” and “row” if your content is to span the whole width?

由 孤者浪人 提交于 2019-12-20 15:31:05
问题 I think the standard of Bootstrap 3 and 4 is <div class="container"> <div class="row"> <div class="col-md-4"> ... </div> <div class="col-md-8"> ... </div> <!-- just add up to 12 --> </div> </div> But what if you have a div , table , form , or any element, that you plan to just let it span the whole width? Then do you need the container or row or col-md-12 at all, for the whole page to display well under the styling rules of Bootstrap 3 and 4? P.S. if possible, please point to or quote the

Changing Dropdown Icon on Bootstrap 4

由 本秂侑毒 提交于 2019-12-20 10:44:07
问题 On Bootstrap 3 this was pretty easy, you just had to change span and add whatever icon you wanted instead. But that doesn't seem the case with Bootstrap 4. Or maybe I'm missing something? Anyway, here's the basic code for it: <div class="dropdown"> <button class="btn btn-secondary dropdown-toggle" type="button" id="dropdownMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"> Dropdown button </button> <div class="dropdown-menu" aria-labelledby="dropdownMenuButton"> <a
订阅 twitter-bootstrap-4