使用 CSS 将按钮添加到菜单项

Question

我有一个菜单，我希望最后一个菜单项是一个红色按钮。我希望它看起来像这样（如果可能，菜单和蓝线之间的顶部没有间隙）

但是是这样的：我的问题是，当我更改顶部 padding/margin 时，我无法将此项的文本与其余菜单项对齐。这是我正在使用的代码：

.fusion-main-menu .fusion-last-menu-item a{
    background:#FE6C59;
    color: #FFFFFF;
    text-align:center;
    display: block;
    margin-bottom: 10px;
    padding-right:5px;
    padding-left:5px;
    vertical-align: middle; 
    height:60px;
    }

我一直在尝试边距、填充和高度，但无法达到我想要的形式。你可以帮帮我吗？该站点是：tfs-sl.com

Answer 1

在 link 中有一个 span 元素。把你的造型放在那个上面：

.fusion-main-menu .fusion-last-menu-item a span {
  background:#FE6C59;
  color: #FFFFFF;
  padding:4px;
  }

使用 CSS 将按钮添加到菜单项

Add Button to Menu Item with CSS

css

wordpress

menu

button

menuitem