Need help with spacing between menus
Tried using margin left and margin right but it's not working
File: _Layout.cshtml
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>@ViewBag.Title - My ASP.NET Application</title>
@Styles.Render("~/Content/css")
@Scripts.Render("~/bundles/modernizr")
<style>
/* .space{
margin-left:5px;
}*/
</style>
</head>
<body>
<div class="navbar-fixed-top">
<div class="col-md-12">
<a link href="" style="font-size:20px;">ABCD Technology</a>
</div>
</div>
<div class="row">
<div class="col-md-12">
<div class="row">
<div class="col-md-8"></div>
<div class="col-md-4 space">
<div style="margin-right:20px;"></div>
@Html.ActionLink("Home", "Index", "Home")
@Html.ActionLink("Services", "Index", "Home")
@Html.ActionLink("PortFolio", "Index", "Home")
@Html.ActionLink("About", "Index", "Home")
@Html.ActionLink("Hire Developer", "Index", "Home")
</div>
</div>
</div>
</div>
@RenderBody()
<div class="navbar-fixed-bottom" style="margin-left:45px;">
<footer>
<p>© @DateTime.Now.Year - <a href="/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="1e5d716e674c7779766a5e78726a307d7173">[email protected]</a></p>
</footer>
</div>
@Scripts.Render("~/bundles/jquery")
@Scripts.Render("~/bundles/bootstrap")
@RenderSection("scripts", required: false)
</body>
</html>
site.css
body {
padding-top: 50px;
padding-bottom: 20px;
}
/* Set padding to keep content from hitting the edges */
.body-content {
padding-left: 15px;
padding-right: 15px;
}
/* Override the default bootstrap behavior where horizontal description lists
will truncate terms that are too long to fit in the left column
*/
.dl-horizontal dt {
white-space: normal;
}
/* Set width on the form input elements since they're 100% wide by default */
input,
select,
textarea {
max-width: 280px;
}
https://i.sstatic.net/o2z8s.png
Also tried the following code with no success:
<div style="margin-left:5px;"></div>
Using an external CSS class like:
<style>
/* .space{
margin-left:5px;
}*/
</style>
but still facing issues.
See image above for reference, attempting to add space between menus
Is there a change needed in the site.css class or is the menu design incorrect?