el-button设置position: absolute;不可点
时间: 2024-03-27 22:10:42 浏览: 15
当一个元素的 position 属性值设置为 absolute 或 fixed 时,它会脱离文档流并且不再占据原来的空间,而是相对于父元素或者文档的左上角进行定位。这就可能导致一些问题,比如元素不可点击的问题。
如果你的 el-button 设置了 position: absolute; 之后,导致不可点击,那么可以尝试以下几种解决方法:
1. 确认父元素是否设置了 position 属性。如果父元素没有设置 position 属性,那么子元素设置 position: absolute; 就会相对于文档定位,而不是相对于父元素定位。
2. 如果父元素设置了 position 属性,那么可以尝试给父元素设置一个 z-index 值,比如 z-index: 1;,然后再给子元素(即 el-button)设置一个更高的 z-index 值,比如 z-index: 2;。这样就可以让 el-button 覆盖在父元素之上,同时仍然保持可点击性。
3. 如果以上两种方法都没有解决问题,那么可以尝试给 el-button 设置一个合适的 width 和 height 属性,或者给 el-button 的父元素设置一个合适的 padding 属性,以确保 el-button 能够完全显示出来,并且点击区域不会被其他元素挡住。
希望这些方法能够帮助你解决 el-button 不可点击的问题。
相关问题
<el-button type="danger" v-if="this.dataitem.CHI_MED_FORM_NO" @click="deletefun" :disabled="!isEditing" style="position: absolute; left: 20px; top: 10px" > 删除 </el-button> <el-button @click="enableEditing" style="position: absolute; left: 70px; top: 10px" > 编辑 </el-button>如何让按钮浮动
要让按钮浮动,可以使用CSS的定位属性`position`和偏移属性`left`和`top`来实现。在你的代码中,已经使用了`position: absolute;`来设置按钮的绝对定位,现在只需要调整按钮的`left`和`top`值来改变按钮的位置。
例如,将删除按钮向右偏移一定距离可以通过增加`left`的值来实现:
```html
<el-button
type="danger"
v-if="this.dataitem.CHI_MED_FORM_NO"
@click="deletefun"
:disabled="!isEditing"
style="position: absolute; left: 120px; top: 10px" <!-- 调整left值为120px -->
>
删除
</el-button>
```
同样地,你可以调整编辑按钮的位置。通过改变`left`和`top`的值,你可以实现按钮的浮动效果。
请根据你的需求调整按钮的位置和偏移值,使其符合你想要的浮动效果。
设置el-radio-button下横线
可以通过设置 el-radio-button 的 ::after 伪元素来实现下横线的效果,具体代码如下:
```css
.el-radio-button::after {
content: '';
display: block;
width: 100%;
height: 2px;
background-color: #409EFF;
position: absolute;
bottom: 0;
left: 0;
}
```
其中,通过设置 position: absolute 和 bottom: 0 来让伪元素在 el-radio-button 底部显示,通过设置 width: 100% 和 height: 2px 来设置伪元素的宽度和高度,从而实现下横线的效果。