分离的元素被忽略，现在组合在一起

目前在学习MVC的过程中，我认为它干扰了HTML代码。我只有一个基本的导航菜单作为列表，两个<li>项目似乎合并为一个。有办法确保他们俩在现场是分开的吗?

@if ((Request.Url.AbsolutePath.ToString().ToLower() != "/home/index") && (Request.Url.AbsolutePath.ToString() != "/"))
{
    <nav data-spy="affix" data-offset-top="500" style="border-radius:0px; left: 0" ng-hide="sideBar" id="nav">
        <img src="~/Content/images/open.png" ng-model="sideBar" id="sideBarOpen" style="left:0px; top:0;"/>
        <div id="sideBar" style="left: -200px">
            <ul>
                <li><a href="@Url.Action("Index", "Home")" id="navHeader"> Home </a></li>
                <li><br /></li>
                <li><a href="@Url.Action("AboutMe", "Home")" id="">About Me</a></li>
#############
                <li><a href="@Url.Action("Experience", "Home")" id=">Experience</a></li>
                <li><a href="@Url.Action("Resume", "Home")" id="">Resume</a></li>
############ These two seem to be recognized as 1 <li> and not two.
                <li><a href="@Url.Action("Contact", "Home")" id="">Contact</a></li>
            </ul>
            <img src="/Content/images/myPic.jpg" />
                </div>
    </nav>
    <div id="sideBarBack" style="width:0%;">
    </div>
}