title: Position relative is not working when a master page is including in a aspx page
body: <p>This is my master page code...........</p>
  
  <pre><code>&lt;%@ Master Language="C#" AutoEventWireup="true" CodeBehind="Home.master.cs" Inherits="AP5.MasterPage.Home" %&gt;
  
  &lt;!DOCTYPE html&gt;
  
  &lt;html lang="en"&gt;
  &lt;head runat="server"&gt;
      &lt;meta charset="utf-8"&gt;
      &lt;title&gt;&lt;/title&gt;
  &lt;meta name="viewport" content="width=device-width, minimum-scale=1, maximum-scale=1, initial-scale=1.0, user-scalable=no"&gt;
       &lt;link href="../css/fonticon-styles.css" rel="stylesheet" type="text/css"&gt;
      &lt;link href="../css/vendors/nanoscroller/nanoscroller.css" rel="stylesheet" type="text/css"&gt;
      &lt;link href="../css/style.css" rel="stylesheet" type="text/css"&gt;
  
  
  
  
  
  
      &lt;asp:ContentPlaceHolder ID="head" runat="server"&gt;
      &lt;/asp:ContentPlaceHolder&gt;
  &lt;/head&gt;
  &lt;body&gt;
      &lt;form id="form1" runat="server"&gt;
  
          &lt;div class="body-inner nano"&gt;
              &lt;div class="nano-content"&gt;
                  &lt;!--Main Nav container --&gt;
                  &lt;aside id="sidebar"&gt;
                      &lt;asp:PlaceHolder ID="phMenu" runat="server" EnableViewState="true"&gt;&lt;/asp:PlaceHolder&gt;
                  &lt;/aside&gt;
                  &lt;div id="page"&gt;
                      &lt;header id="header" class="hidden-md hidden-small"&gt;
                          &lt;div class="container"&gt;
  
                          &lt;/div&gt;
                      &lt;/header&gt;
                      &lt;asp:ContentPlaceHolder ID="ContentPlaceHolder1" runat="server"&gt;&lt;/asp:ContentPlaceHolder&gt;
  
                  &lt;/div&gt;
              &lt;/div&gt;
          &lt;/div&gt;
      &lt;/form&gt;
      &lt;script src="../Js/jquery/jquery.min.js"&gt;&lt;/script&gt;
      &lt;script src="../Js/nanoscroller/jquery.nanoscroller.min.js"&gt;&lt;/script&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>This is my css which is creating problem ....</p>
  
  <pre><code>.nano {
    position : relative;
    width    : 100%;
    height   : 100%;
    overflow : hidden;
  }
  
  .nano &gt; .nano-content {
    position      : absolute;
    overflow      : scroll;
    overflow-x    : hidden;
    top           : 0;
    right         : 0;
    bottom        : 0;
    left          : 0;
  }
  </code></pre>
  
  <p>When I am making a aspx page including this master page, the master page in not showing the page content. But when I remove relative property from nano class the content is showing but nano scroller is creating a horizontal scroll bar in the page and I want to remove this scroll bar with showing all page content. I use all css and js files properly. Even a text is also not showing in aspx page. But it is working nice in a normal html page. Through master page it is not working properly. Either content is not showing or scroll bar is showing horizontally or nano scroll bar is not working. </p>
  
  <p>Anybody know how to fix this problem?</p>