Link with href to id on page not including route data

Question

Generating documentation in an ASP.NET Core MVC app. The view renders headings with ids and the contents of other sections needs to link to them.

Example view:

@foreach (MyObject thing in Model)
{
    <h5 id="@thing.Name">@thing.Name</h5>

    <h6>List</h6>
    @foreach (MySubObject otherThing in thing.SubObjects)
    {
        <div class="row">
            <div class="col-md-4 col-sm-6">@otherThing.Name</div>
            
            <div class="col-md-4 col-sm-6">
                @if (otherThing.HasParent)
                {
                    <a href="@($"#{otherThing.ParentName}")">
                        @otherThing.ParentName
                    </a>
                }
            </div>
        </div>
    }
}

This generates exactly what I want it to:

    <div class="row">
        <div class="col-md-4 col-sm-6">OtherThing7Name</div>
        
        <div class="col-md-4 col-sm-6">
                <a href="#ParentName">
                    ParentName
                </a>
        </div>
    </div>
    ...
    <h5 id="ParentName">ParentName</h5>

But the link, when I hover over it, goes to http://localhost/#ParentName instead of preserving the route data e.g. http://localhost/Documentation/Things#ParentName, so instead of just jumping to that location on the page, it takes it to the root of the application.

Update:

Okay, it looks like this is happening because <base href="~/" /> is defined in the View Layout being used (which all Views in the application use). Removing it allowed the link to work as expected, but I don't know what effects it would have on the rest of the site.