为什么我的容器大小与文本大小无关?

时间:2014-06-10 12:27:42

标签: css css3 twitter-bootstrap sass

<section id="slide-2" class="homeSlide">
    <div class="bcg"
        data-center="background-position: 50% 0px;"
        data-top-bottom="background-position: 50% -100px;"
        data-bottom-top="background-position: 50% 100px;"
        data-anchor-target="#slide-2"
    >
        <div class="hsContainer">
            <div class="hsContent"
                data-center="opacity: 1"
                data-center-top="opacity: 0"
                data--100-bottom="opacity: 0;"
                data-anchor-target="#slide-2"
            >
            <h2>TextTextTextTextTextTextTextTextText
                TextTextTextTextTextTextTextText</h2>
          </div>
          </div>
      </div>
 </section>

为什么我的container size not relative文字大小?为什么要占全宽?如何减少carries the h2 text

的容器宽度

http://jsfiddle.net/bMCb8/

1 个答案:

答案 0 :(得分:1)

divh2都是块元素。这意味着除非您指定宽度,否则它们将占用可用宽度。要实现您的目标,您可以尝试在display: inline; - 元素上设置h2。但是当元素具有position: fixed时,这将不起作用,在这种情况下,您需要设置固定在包装元素上的位置。

http://jsfiddle.net/bMCb8/1/

Se more about position fixed display inline issue