I'm developing an app in ASP.Net MVC4 and am having a strange issue with whitespace. I've developed plenty of MVC3 sites with Razor without this issue.
Here's my template cshtml file:
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width" />
<title>HF - Content Management - @ViewBag.Title</title>
<link href="@Url.Content("~/content/bootstrap/bootstrap.min.css")" rel="stylesheet" />
@Styles.Render("~/bundles/css/hf-cms-logged-in")
</head>
<body>
@Html.Partial("Partials/NavBar")
<div class="container">@RenderBody()</div>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script src="@Url.Content("~/scripts/bootstrap/bootstrap.min.js")"></script>
@Scripts.Render("~/bundles/js/validation")
<script src="@Url.Content("~/scripts/hf-cms.js")"></script>
</body>
</html>
Note the line with the RenderBody() call - there's no extraneous whitespace here.
When I call an action, the rendered body is prepended with some whitespace which I can't see that I've added, and can't seem to get rid of. I call an action with no logic, it only returns the following view:
@{
ViewBag.Title = "Dashboard";
}
<h1>Dashboard</h1>
It's definitely using the correct template (specified in my _ViewStart.cshtml)
Viewing the page in Google Chrome, the source shows extra whitespace. See the image below:
A similar issue can be seen in IE10. This is obviously affecting the design. I've tried using Meleze.Web to strip out any extra whitespace, but whitespace still remains.
I'm at a loss with this one, as it's a relatively simple site so far, there's nothing funky going on yet, so I can't see where this whitespace is coming from.
Has anybody else seen this with MVC4 or Razor before?
Edit: I've tried removing all stylesheets and script files, the whitespace still exists.
@section is for defining a content are override from a shared view. Basically, it is a way for you to adjust your shared view (similar to a Master Page in Web Forms).
The difference between them is that View Pages are Razor views that are used to provide the HTML representations (aka views) for services in much the same way View Pages work for MVC Controllers.
ViewData is a container for data to be passed from the PageModel to the content page. ViewData is a dictionary of objects with a string-based key. You add items to ViewData as follows: public class IndexModel : PageModel.
Razor View Engine is a markup syntax which helps us to write HTML and server-side code in web pages using C# or VB.Net. It is server-side markup language however it is not at all a programming language.
After struggling with this for a while, I've found the solution.
There must have been a funny character in the root _ViewStart.cshtml file. I deleted the contents of the ViewStart file and retyped it, which solved the problem. This got me thinking that a strange character could be causing the issue.
Don't like answering my own question, but I hope this helps somebody else. In theory, this won't be an MVC4-specific issue, you could encounter the same problem in MVC3.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With