Consider below styles:
<template>
<!-- Some Tags -->
<div class="mb-8 w-full">
<span class="subline"></span>
</div>
</template>
.
.
.
<style scoped lang="scss">
.subline {
border-bottom: dashed 2px #eee;
display: block;
}
.subline::before { /* Not working ! */
width: 30px;
height: 20px;
z-index: 99999;
border-bottom: dashed 2px green;
position: fixed;
bottom: 0;
left: 0;
}
</style>
I need to use ::before
but does not working !
How can I achieve that ?
CodePudding user response:
Pseudo elements require a content
property to be visible, add content: ""
to solve this issue
.subline::before {
content: "";
width: 30px;
height: 20px;
z-index: 99999;
border-bottom: dashed 2px green;
position: fixed;
bottom: 0;
left: 0;
}