How to create border around menu item in Blogger blog?

I'm trying to customize my blogger blog. I want to add a white border around the "SUBSCRIBE" menu item to make it more noticeable.

I've been reading some articles and they tell me to identify first the id of the specific menu item but when I right-click on "SUBSCRIBE" I only see but no ID...

Edit: here is the code in question:

<div class="widget PageList" data-version="1" id="PageList1">
    <div class="widget-content">
        <div class="menus">
            <ul class="nav">
                <li class="parent"><a href="https://www.thekawaiifiles.com/">Home</a></li>
                <li class="parent"><a href="https://www.thekawaiifiles.com/p/about.html">About</a>
                <li class="parent"><a href="https://www.thekawaiifiles.com/p/archive.html">Archive</a></li>
                <li class="parent"><a href="https://urlshortenerlinkchangedforstackoverflow.com">Subscribe</a></li>
            </ul>
        </div>
    </div>
</div>

Solution

Your menu item has no ID, but you can target the last element in the menu by using

#PageList1 .nav li:last-child a {
    border: 2px solid #fff;
    padding: 4px;
}

If it's not always the last element in the menu, then you can target it using the nth-child() selector, i.e.

#PageList1 .nav li:nth-child(4) a {
    ...
}