添加`position:fixed；`后元素不见了

问题

我想让header元素固定在页面顶部，所以加了position:fixed;，并且设置了top:0;,但是实际情况是添加完position:fixed;后，整个header就不显示了

//  用于搭建项目的框架结构
<template>
  <div>
    <header></header>
  </div>
</template>

<style scoped>
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}
header {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 10;
  line-height: 60px;
  height: 60px;
}
</style>

解决

经过多方查找测试，最后发现没有给元素设置宽度，只要给元素添加width:100%就能正常显示啦