Bootstrap Carousel子元素不会显示响应边距或填充

时间:2018-09-30 13:44:24

标签: twitter-bootstrap spacing

我想在Bootstrap的轮播中获取carousel-caption元素,以允许其中的元素在标准的Bootstrap断点({{1},smmd,{{1} }。

目前,无论我在轮播字幕元素或其任何子元素(例如lgxl元素中添加类(例如pb-lg-5)时做什么, ),将仅使用一个值。在所有四个断点之间指定填充将不起作用。如果我将<h2>元素的填充设置为“ pb-sm-2 pb-md-4 pb-lg-5 pb-xl-1”,则只有一个值会起作用,而其他值都不会起作用正确显示。

下面是我的工作示例。

http://codepen.io/stripeycat/pen/WavdXQ

<p>

这是由于放置在转盘中引起的问题吗?还是我完全错过了什么?

2 个答案:

答案 0 :(得分:0)

1)为什么在pb-xl-1中使用pb-sm-2 pb-md-4 pb-lg-5 pb-xl-1? “对于最宽的屏幕-最小的填充”似乎不合逻辑;接下来,您的样本是同样不清楚的“ mb-sm-1 mb-md-4 mb-lg-3 mb-xl-5”,为什么不mb-md-3 mb-lg-4呢?

2)仅应使用序列中的一个填充值,这是设计使然,取决于屏幕大小;对于pb-sm-2 pb-md-3 pb-lg-4 pb-xl-5-https://codepen.io/rpokrovskij/pen/NOqzEX这样的自然增长序列,每个屏幕调整大小时,都非常清楚。

3)据我所知,您的情况-轮播没有特定内容

答案 1 :(得分:0)

我已经隔离了问题;当我在其他自定义CSS文档中编写了其他Bootstrap样式的Spacing类时,我相信相对于层叠而言,这些类没有得到正确的引用。

在将这些代码直接重写为引导样式表之后(遵循现有CSS的确切形式),浏览器现在可以正确地吸引我的其他样式。