El-cascader cascade selector style error in el-dialog

  1. I introduced el-cascader in el-dialog, but there is a problem with the display style of the cascaded display.
  2. style code
    <el-dialog title="" :visible.sync="changeTableDialogVisible" width="40%" center>
      <el-cascader :options="options" @change="handleChange"></el-cascader>
      <span slot="footer" class="dialog-footer">
        <el-button @click="changeTableDialogVisible = false"></el-button>
        <el-button type="primary" @click="confirmChangeTable"></el-button>
      </span>
    </el-dialog>
  1. error screenshot

Apr.10,2022

upstairs is right to see why the layout is messed up
. If it is convenient to paste the settings


of options , rewrite the style of cascader. Given a width, if it exceeds the width, a horizontal scroll bar is displayed.


there is no confusion as you said, the pop-up title sets the center attribute to be centered, your display is left, review the lower cascading elements, it should be your own style that affects it.

clipboard.png
https://jsfiddle.net/t5q3saon/


check the layout

MySQL Query : SELECT * FROM `codeshelper`.`v9_news` WHERE status=99 AND catid='6' ORDER BY rand() LIMIT 5
MySQL Error : Disk full (/tmp/#sql-temptable-64f5-1b3dd4f-e915.MAI); waiting for someone to free some space... (errno: 28 "No space left on device")
MySQL Errno : 1021
Message : Disk full (/tmp/#sql-temptable-64f5-1b3dd4f-e915.MAI); waiting for someone to free some space... (errno: 28 "No space left on device")
Need Help?