如何确保元素的位置在引导程序2中是固定的

How to ensure the location of an element is fixed in bootstrap 2?

本文关键字：引导程序 位置 确保 元素 何确保      更新时间：2023-12-24

我在Twitter Bootstrap 2中构建了一个登录页。

  <section id="about">
    <div class="container">
      <div class="row">
        <div class="span12">
          <h1>We are experts in <span class="underline" id="typer-1">business solutions</span></h1>
        </div>
        <div class="feature span4">
          <div aria-hidden="true" class="icon icon-tint"></div>
          <h3>Design</h3>
          <p class="hidden-phone">Proin ut quam eros. Donec sed lobortis diam. Nulla nec odio lacus. Quisque porttitor egestas dolor in placerat. Nunc vehicula dapibus ipsum. Duis venenatis risus non nunc fermentum dapibus.</p>
        </div>
        <div class="feature span4">
          <div aria-hidden="true" class="icon icon-code"></div>
          <h3>Development</h3>
          <p class="hidden-phone">Proin ut quam eros. Donec sed lobortis diam. Nulla nec odio lacus. Quisque porttitor egestas dolor in placerat. Nunc vehicula dapibus ipsum. Duis venenatis risus non nunc fermentum dapibus.</p>
        </div>
        <div class="feature span4">
          <div aria-hidden="true" class="icon icon-mobile"></div>
          <h3>Apps</h3>
          <p class="hidden-phone">Proin ut quam eros. Donec sed lobortis diam. Nulla nec odio lacus. Quisque porttitor egestas dolor in placerat. Nunc vehicula dapibus ipsum. Duis venenatis risus non nunc fermentum dapibus.</p>
        </div>
      </div>
    </div>   </section>

我正在使用一个jQuery插件typed.js来旋转单词以使其更漂亮，然而，不幸的是，在这个设置中，它不能按预期工作。

问题是，一旦typed.js更改了一个字符，就会移动（重新居中）h1文本块。所以这篇文章真的很模糊，很难阅读。

有没有什么方法可以使h1块的位置保持静态，这样当其内容的长度发生变化时它就不会移动？

使用html、bootstrap 2.3和typed.js中的示例，我无法在中复制它

这个jsfiddle

note: click on the button to start typing

你的css中一定有其他东西导致的重新定位和模糊

编辑：是的，text-align: center;在h1上，每次都会重新计算位置。text-align: left;是解决方案！

相关文章：