_Layout styles not applied to Partial View rendered in a popup - asp.net-mvc-3

Question

I am loading a partial view in the popup using following code:
<div id="Mydiv" title="Modify" class="ModifyRule" style="overflow: hidden" />
<script type="text/javascript">
$(document).ready(function () {
//define config object
var dialogOpts = {
title: "Modify Rule",
modal: true,
autoOpen: false,
height: 300,
width: 700,
open: function () {
//display correct dialog content
$("#Mydiv").load("Modify", { SelectedRow: $('#MyParam').val() });
}
};
$("#Mydiv").dialog(dialogOpts); //end dialog
$('#Modify').click(
function () {
$("#Mydiv").dialog("open");
return false;
}
);
});
</script>
Here is the code from partial view:
#Code
Using (Html.BeginForm())
#<div id="Master">
<table>
<tr>
<td>
#Html.LabelFor(Function(model) model.InputAuthorityGridDetail.TcmAccount)
</td>
<td>#Html.EditorFor(Function(model) model.InputAuthorityGridDetail.TcmAccount)
</td>
<td>
#Html.LabelFor(Function(model) model.InputAuthorityGridDetail.Amount)
</td>
<td>#Html.EditorFor(Function(model) model.InputAuthorityGridDetail.Amount)
</td>
</tr>
<tr align="right">
<td>
<input name="button" type="submit" value="Save" class="btn" />
</td>
</tr>
</table>
</div>
End Using
End Code
the controller method modify returns a partial view named _Modify, the view is rendered correctly in the popup but I notice that the CSS styles are not applied to the controls in the partial view can someone help me?

Answer 1

When a partial is loaded into a layout page, the layout page contain the reference to the css that is used by the partial view.
However, from what I gather here (my javascript is not that great), you are loading the partial directly into a popup display and not using the layout page? If this is correct then your partial will not know about the css. And to correct this you would need to add a reference to the css at the top of the partial.

Answer 2

My partial views dont start with #Code and dont end with End Code. Try removing them and see if it works then.