如何让<el-menu>中的<el-menu-item index="1">首页</el-menu-item>，进行居中，同时<el-submenu>右浮动而不会挤出去。刚刚用你提供的发现不行

如果按照我之前提供的样式仍无法实现效果，可能还需要添加一些其他的样式。可以尝试以下 CSS 代码：

.el-menu {
  display: flex;
  justify-content: center;
  align-items: center;
}

.el-menu-item:nth-child(1) {
  margin-right: auto;
}

.el-submenu {
  float: right;
  margin-left: auto;
}

这段代码中，我们使用了 `align-items: center` 来使得菜单项在垂直方向上居中，使用 `margin-right: auto` 来将第一个菜单项右侧的空间占满，实现居中的效果。同时，对于 `el-submenu`，我们使用了 `margin-left: auto` 来使其右浮动而不会被挤出去。

希望这次的回答能够解决你的问题。

相关问题

<el-menu>中，如何让指定的<el-menu-item>进行居中，让指定的<el-submenu>右浮动

要实现这个效果，可以使用 CSS 的 flex 布局。可以为整个 `el-menu` 设置为 `display: flex`，然后为需要居中的 `el-menu-item` 设置 `margin: auto`，即可实现居中的效果。同时，可以为需要右浮动的 `el-submenu` 设置 `margin-left: auto`，即可实现右浮动的效果。具体的 CSS 代码如下：

.el-menu {
  display: flex;
}

.center {
  margin: auto;
}

.right {
  margin-left: auto;
}

在 HTML 中，需要给需要居中的 `el-menu-item` 添加一个 `class="center"`，需要右浮动的 `el-submenu` 添加一个 `class="right"`，如下所示：

<el-menu>
  <el-menu-item class="center">居中菜单项</el-menu-item>
  <el-menu-item>普通菜单项</el-menu-item>
  <el-submenu class="right">
    <template slot="title">右浮动子菜单</template>
    <el-menu-item>子菜单项 1</el-menu-item>
    <el-menu-item>子菜单项 2</el-menu-item>
  </el-submenu>
</el-menu>

希望这个回答能够帮助到你。

<el-submenu>中的<el-menu-item>，触发时的颜色如何设置

<-menu-item>触发时的颜色可以通过设置<el-menu-item>的属性"active-text-color"来实现。例如，如果你想要触发时的颜色为红色，可以这样写：

<el-submenu index="1">
  <template slot="title">
    <i class="el-icon-location"></i>
    <span>导航一</span>
  </template>
  <el-menu-item index="1-1" :active-text-color="'red'">选项1</el-menu-item>
  <el-menu-item index="1-2" :active-text-color="'red'">选项2</el-menu-item>
  <el-menu-item index="1-3" :active-text-color="'red'">选项3</el-menu-item>
</el-submenu>

在这个示例中，当选项被触发时，文字颜色将变为红色。