【问题标题】:Center bootstrap carousel text vertically, weird issue垂直居中引导轮播文本,奇怪的问题
【发布时间】:2014-07-10 09:26:00
【问题描述】:

好的,所以我遇到了一个奇怪的问题,我在这个快速技巧中使用第二种方法将我的内容垂直居中在引导轮播中:

http://css-tricks.com/centering-in-the-unknown/

现在我得到了这个工作,但是我的内容所在的容器变得流动了,所以我必须使用偏移量来获取我想要的区域内的内容,这给我带来了各种各样的问题。

当我放置我的 CSS 类时

.center-vertically-right { display: table-cell; text-align: right; vertical-align: middle; }

在子元素中,这不再有效。我还将display: table; 移至父级。

我已经设置了一个 jsFiddle 来演示我的问题:

幻灯片 1: .center-vertically-right 子类内部(不再工作)

幻灯片 2: 演示了 .center-vertically-left 类内部的问题 .container 导致布局变得流畅。

幻灯片 3: 以引导偏移为中心的流畅布局(不是我想要的)

我已阅读所有相关问题,但仍然找不到解决方案。

昨晚我整晚都在尝试不同的垂直居中方法,这似乎是我能用 display: table 方法得到的最接近的方法。我尝试了this method,但也没有成功,还有其他几个常见的,似乎没有任何效果我目前正在考虑更改设计,但可能仍会尝试在未来解决这个问题。

【问题讨论】:

    标签: html css twitter-bootstrap


    【解决方案1】:

    this(幻灯片 2)是您要查找的内容吗?我想你只需要把.container 放在.center-vertically-right 里面。

    【讨论】:

    • 是的,你是对的,我昨天想通了,只是忘记回帖了。这么简单的修复,前几天晚上有点累!谢谢
    猜你喜欢
    • 2018-02-05
    • 1970-01-01
    • 2014-09-18
    • 2015-02-01
    • 2017-02-12
    • 1970-01-01
    • 1970-01-01
    • 2019-04-01
    • 2013-11-07
    相关资源
    最近更新 更多