title: MVC 3: Can't Load Partial View without Inheriting CSS from Master Page (Telerik Report Viewer + Bootstrap)
body: <p>I'm having a css conflict/collision issue using Telerik Reporting in a MVC 3 application.  It's a known issue that there is a css issue with the standard Site.css and their report viewer.  However, our application is using Twitter Bootstrap for the UI css, and I cannot find the conflicting areas for anything.  Since I can't find the conflicting css (I'm not even sure if I would be able to fix it without breaking the rest of the css in the application), my second thought was to load the partial view without the css, which should, in theory, work with no problems.  However, I cannot get the partial view to load without inheriting the CSS from the master page.  The site is using the Razor view engine, and the partial view with the report viewer is using the web forms view engine since Telerik has not updated their reporting yet (this is with Q1 2013).  Is there any way I can force this view to load without inheriting any of the css from the Master Page (Layout.cshtml)?  My code is below:</p>
  
  <p>Main Page</p>
  
  <pre><code>@{
    ViewBag.Title = "Reports";
  }
  
  &lt;h2&gt;Reporting&lt;/h2&gt;
  
  @Html.Partial("_UnderContructionPartial")
  
  @{
    Html.RenderPartial("ReportViewer");
  }
  </code></pre>
  
  <p>View with Report Viewer</p>
  
  <pre><code>&lt;%@ Page Language="C#" Inherits="System.Web.Mvc.ViewPage&lt;dynamic&gt;" %&gt;
  
  &lt;%@ Register Assembly="Telerik.ReportViewer.WebForms, Version=7.0.13.220, Culture=neutral, PublicKeyToken=a9d7983dfcc261be" Namespace="Telerik.ReportViewer.WebForms" TagPrefix="telerik" %&gt;
  &lt;%@ Register Assembly="Telerik.Reporting, Version=7.0.13.220, Culture=neutral, PublicKeyToken=a9d7983dfcc261be" Namespace="Telerik.Reporting" TagPrefix="telerik" %&gt;
  
  &lt;!DOCTYPE html&gt;
  
  &lt;html&gt;
    &lt;head runat="server"&gt;
      &lt;title&gt;Report&lt;/title&gt;
    &lt;/head&gt;
    &lt;body&gt;
      &lt;script runat="server"&gt;
        public override void VerifyRenderingInServerForm(Control control)
        {
          // to avoid the server form (&lt;form runat="server"&gt; requirement
        }
        protected override void OnLoad(EventArgs e)
        {
          base.OnLoad(e);
          var instanceReportSource = new Telerik.Reporting.InstanceReportSource();
          //instanceReportSource.Parameters.Add(new Telerik.Reporting.Parameter("UserName", ViewData["UserName"].ToString()));
          instanceReportSource.ReportDocument = new program1.Web.Reports.TestReport();
          ReportViewer.ReportSource = instanceReportSource;
          ReportViewer.ViewMode = ViewMode.PrintPreview;
        }
      &lt;/script&gt;
  
      &lt;form id="main" method="post" action=""&gt;
        &lt;telerik:ReportViewer ID="ReportViewer" Width="100%" Height="800px" runat="server"&gt;
        &lt;/telerik:ReportViewer&gt;
      &lt;/form&gt;
    &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>Controller</p>
  
  <pre><code>public ActionResult ReportViewer()
  {
    return PartialView("ReportViewer");
  }
  </code></pre>
  
  <p>This is what the report viewer looks like:</p>
  
  <p><img src="https://i.stack.imgur.com/f1InK.png" alt="enter image description here"></p>
  
  <p>And this is what it "should" look like:</p>
  
  <p><img src="https://i.stack.imgur.com/KzLfN.png" alt="enter image description here"></p>