求助：怎么解决因为宽度超出产生的横向滚动条导致纵向滚动条

[xftxyz2001]

<script setup>
import { ref } from "vue";
import VueJsonPretty from "vue-json-pretty";
import "vue-json-pretty/lib/styles.css";

const data = ref({l:"Lorem ipsum dolor sit amet consectetur adipisicing elit. Eum consequatur quo suscipit, consectetur pariatur, accusantium nulla quam voluptate distinctio culpa tempora harum in quisquam explicabo, rerum autem? Sit, temporibus doloribus?"});
</script>

<template>
  
  <ElContainer style="width: 90vw; height: 90vh;">
    <ElMain style="background-color: #f9f9f9; padding: 5px">
      <ElAutoResizer>
        <template #default="{ width, height }">
          <VueJsonPretty
            :data="data"
            :virtual="true"
            :height="height"
          />
        </template>
      </ElAutoResizer>
    </ElMain>
  </ElContainer>
</template>

控制台发现设置在组件上的高度是实际设置在里面的div上了

求助大佬，这个应该怎么解决？