Vue.js 组件的元素没有占据页面宽度的100% 更新|找到原因：

如果你把标签放进去，就会发生这种情况

问题 我不确定它是否应该这样工作

但是组件并没有占据100%的页面宽度。您总是必须手动指定组件路由页面的宽度，还是我做错了什么

我正在使用通过npm安装的Vuetify.js库

我希望Home.vue页面上的此元素此处的一些文本像往常一样占据页面宽度的100%，但它不是：

代码： App.vue | router=>Home.vue Home.vue页面 这是一个css问题，在Home.vue中显式地将div width设置为100%应该可以：

<css scoped>
div {
  width: 100%;
}
</css>

---

谢谢这就是它应该的方式，我必须明确地使每个页面组件的宽度：100%？第一次这么做，我很惊讶没有看到默认的显示：block；宽度：vueMaybe中的100%html5行为可能在主或v-app级别上有其他css设置，这些设置覆盖了默认行为。不是很确定，只是猜测。嗯，不是，也许Vuetify.js可能是原因。我不确定。谢谢你的回答，虽然我已经更新了问题，原因是标签。。。谁会想到呢

<template>
    <div>
        <p>some text here</p>
    </div>
</template>


<script>
export default {
  name: 'home',
  data () {
    return {
      snackbar: true
    }
  }
}
</script>

<css scoped>
div {
  width: 100%;
}
</css>