Elementor How to Make the Last Link a Button Easily

In this article we will learn about how to be make the last link a button easily in Elementor. Most of the time there is a need to separate out to attract more user's attention. To achieve this we need to do some CSS injection to the Elementor header template.

Follow the steps below to easily make the last link a button in Elementor.

Step 1: Open Elementor header template settings

Click on the page settings icon in the bottom left corner of the pFage. This will open up page settings to the top.

Step 2: Locate the header Custom CSS area

1. Go to the advanced tab.
2. Open the Custom CSS collapsible and add the CSS to the text below.

Step 3: Add The custom CSS given below

    selector .elementor-nav-menu li:last-of-type .elementor-item {
        display: inline-block;
    padding: 0.4em 1.6em;
    margin: 0.14em 0;
    border: 0.16em solid rgba(0,0,0,0);
    border-radius: 2em;
    font-weight: 300;
    color: rgba(255,255,255,0.9);
    text-align: center;
    background-color: rgba(0,0,0,.71);
      }

So, this is how the last link looks after injecting the CSS.

To get a different look, you can either edit the CSS, or generate some with this CSS button generator.

Conclusion

Alright! Now you know how to make the last link a button in Elementor. This will make your web page more user friendly.