width 相关问题

我有一个带有 Bootstrap 4 toast 的页面，我将 toast 的位置设置为位置：固定。整个吐司部分如下所示：我有一个带有 Bootstrap 4 toast 的页面，我将 toast 的位置设置为 postion: fixed。整个吐司部分是这样的： <div class="container mt-5"> <button type="button" class="btn btn-primary" id="liveToastBtn">Toast it</button> <div id="toastContainer" style="position: fixed; top: 1.5vw; right: 1vw; bottom: 4.5vw; z-index: 9;"> <div class="toast show" role="alert" aria-live="assertive" aria-atomic="true"> <div class="toast-header"> <img src="..." class="rounded mr-2" alt="..."> <strong class="mr-auto">Bootstrap</strong> <small>11 mins ago</small> <button type="button" class="ml-2 mb-1 close" data-dismiss="toast" aria-label="Close"> <span aria-hidden="true">×</span> </button> </div> <div class="toast-body"> Hello, world! This is a toast message. </div> </div> </div> </div> 您可以在 this JSFiddle 中找到完整的工作代码。该作品按原样工作得很好，但现在我想将 toast 的宽度设置为视口的 50% 左右。在 <div id="toastContainer"...> 行中，我尝试设置 width 属性： <div id="toastContainer" style="position: fixed; top: 1.5vw; width: 50%; right: 1vw; bottom: 4.5vw; z-index: 9;"> 或者我尝试设置left： <div id="toastContainer" style="position: fixed; top: 1.5vw; left: 50%; right: 1vw; bottom: 4.5vw; z-index: 9;"> 但在这两种情况下，出现的 toast 的 width 都不会改变（仅其水平 position）。如何设置 Bootstrap 4 toast 的宽度？我找到了办法。它也有帮助，它在网站上，我可以直接在上面尝试东西，让事情变得更容易。我不知道你是否熟悉 bootstrap 但是有这样的东西可以让你通过将 class="col-x" （x 在 1-12 之间）的东西放入 a 中来“控制”东西的长度div 与 class="row"。 <div class="row"> <button type="button" class="btn btn-primary col-8" id="liveToastBtn">Toast it</button> </div> 正如你所看到的，这就是我所做的，只需在按钮的类中添加 col-8 即可，你可以更改它，但我发现 6 看起来不像 50% 8 更接近。然后你需要一些CSS来使按钮居中: .row{ display:flex; justify-content:center; } 希望这就是您正在寻找的🥶🥶🥶🥶🥶🥶

css twitter-bootstrap bootstrap-4 css-position width

回答 1 投票 0

宽度：继承/100% 子级

我想在图像顶部放置一个侧边栏，其宽度与图像相同。宽度都不是：继承|100% 工作。 CSS 身体 { 显示：柔性； } #主图片{ ...

html css inheritance width nest

回答 1 投票 0

如何设置 Bootstrap 4 toast 的宽度？

css twitter-bootstrap bootstrap-4 css-position width

回答 1 投票 0

Chart.js：有没有办法根据数字图例的项目制作具有固定高度和可变宽度的图表

我想知道如果图例中的项目数量与其初始大小不匹配，是否有办法使图表的宽度增加我尝试了很多不同的设置和方法，例如

javascript css chart.js html5-canvas width

回答 1 投票 0

width 相关问题

最新问题