[Support request] Navigation Element

[Kevin]

I added a menu bar item – “Get Quote” using the following:

<span class="menu-bar-item">
<a href="#"><a href="url">Get Quote</a></a>
	<span>

Two questions:

1. How do I move the get quote to the middle and the hamburger to the right?
2. How do I make the hamburger lines thicker?

Thanks!

[Kevin]

Let me try that again:

<span class="menu-bar-item">
<a href="#">>Get Quote</a></a>
	<span>

[Kevin]

LOL…clearly i’m a novice. Anyway here is what I used as a guide:

https://docs.generatepress.com/article/generate_menu_bar_items/

[Leo]

Hi there,

1. Try this CSS:

@media (max-width: 1100px) {
    .main-navigation .menu-bar-item {
        position: absolute;
        top: 0;
        left: 50%;
        transform: translateX(-50%);
    }
    .main-navigation .menu-toggle
        margin-left: auto;
    }
}

Adding CSS: https://docs.generatepress.com/article/adding-css/

2. Unfortunately that’s not possible with CSS as it’s an SVG image. You’d need to find a new SVG image and replace it.

If you want to go with that route, can you open a new topic so we can handle one question per topic?

Thanks.

[Author]

Posts