javascript - 如何保持div的宽度相同？

Question

我正在制作一个网站，该网站会在特定的秒数内轮换不同的报价，并且在开始时会有延迟。当我加载我的页面时，第一个引用出现，它会自动在我的页面上添加一个滚动条，页面看起来更大。我尝试使用 css 并隐藏滚动条，但它不起作用。我不希望它是固定大小，因为我希望它是百分比宽度。

var quotes = [] //different qutoes are in here

  var nextNum = Math.floor(Math.random() * (quotes.length));
  var randNum;

  var equation;
  function genQuote() {
    randNum = nextNum;
    nextNum = Math.floor(Math.random() * (quotes.length));
    while(randNum == nextNum) {
      nextNum = Math.floor(Math.random() * (quotes.length));
    }
    equation = ((quotes[randNum].length / 4.25) * 60)*3;
    document.getElementById('quote').innerHTML = quotes[randNum];

    setTimeout(genQuote, equation);
  }

    setTimeout(genQuote, 6000);

<p id = "quote"></p>
<!-- tried different styling methods like overflow-x: none, hidden -->

所以我基本上希望没有滚动条，并且引用是响应式的，所以没有设置宽度。

Answer 1

如果你只是想隐藏水平滚动条，那么你可以在你的css中添加以下内容:

body {
    overflow-x: hidden;
}

我想您尝试将 overflow-x 属性添加到您的 paragraph 元素而不是 body 而这就是它没有成功的原因'不工作。