gpt4 book ai didi

css - Vuetify 步进器文本溢出

转载 作者:行者123 更新时间:2023-11-28 01:25:16 24 4
gpt4 key购买 nike

我对 Vuetify 框架中的步进器组件有疑问,其中步骤的文本标签在 IE11 中重叠。请参阅下面的代码笔:

https://codepen.io/thorne51/pen/mjdQXb

HTML

<div id="app">
<v-app id="inspire">
<v-container>
<v-stepper v-model="e1" :alt-labels="true">
<v-stepper-header>
<template v-for="(step, index) in steps">
<v-stepper-step :step="step.stepNr">{{ step.label }}</v-stepper-step>
<v-divider v-if="index + 1 < steps.length"></v-divider>
</template>
</v-stepper-header>

<v-stepper-items>
<v-stepper-content v-for="(step, index) in steps" :step="step.stepNr" :key="index">
{{ step.stepNr }}. {{ step.label }}
</v-stepper-content>
</v-stepper-items>
</v-stepper>
</v-container>
</v-app>
</div>

JS

new Vue({
el: '#app',
data () {
let steps = [];
for (let i = 0; i < 10; i++) {
steps.push({
label: 'regular driver\'s personal details',
stepNr: i + 1,
});
}
return {
e1: 0,
steps: steps,
}
}
})

CSS

.v-stepper__step {
flex: 1 1;
}

最佳答案

简单。只需从 v-stepper__step 类中删除 flex: 1 1;

关于css - Vuetify 步进器文本溢出,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/51284017/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com