Using MasterPages in ASP.NET

I have a few pages on my application now and I am going to start using a master page to low the amount of code in my HTML. So I created a 'Web form using master page' and at the moment I have a menu bar I have created in there:

<%@ Master Language="C#" AutoEventWireup="true" CodeBehind="PersonnelMasterPage.master.cs" Inherits="bSimplex.Personnel.PersonnelMasterPage" %>


    <asp:ContentPlaceHolder ID="cnt_MenuBar" runat="server">
            <div class="bsimplex header-bar left">
        <div class="header-context clearfix header-label">
            <asp:Image ID="bsimplexPTLogo" runat="server" CssClass="small-logo" ImageUrl="~/Images/tracker logoOnly.png" />
            <label class="configurationlbl">Personnel Tracker</label>
        </div>
        <div class="menubarbest">
            <ul id="nav">
                <li  class="current"><a href="bPersonnelTrackerDashboard.aspx" >Home</a></li>
                <li><a href="#">Manager</a>
                    <ul>
                        <li><a href="#">Rota</a></li>
                        <li><a href="#">Holiday Requests</a></li>
                    </ul>
                </li>
                <li><a href="#">Absences</a>
                    <ul>
                        <li><a href="bSicknessForm.aspx">Sickness</a></li>
                        <li><a href="bLatenessForm.aspx">Lateness</a></li>
                        <li><a href="bMedicalLeaveForm.aspx">Medical Appointment</a></li>
                        <li><a href="OtherMedical.aspx">Other</a></li>
                    </ul>
                </li>
                <li><a href="#">Reports</a>
                    <ul>
                        <li><a href="#">Attendance Record</a></li>
                        <li><a href="#">Rota</a></li>
                    </ul>
                </li>
                <li><a href="Admin/Administration.aspx">Admin</a></li>
        </div>
    </div>
    </asp:ContentPlaceHolder>

Then on the Web Form i just created i have added this Content Holder:

<%@ Page Title="" Language="C#" MasterPageFile="~/Personnel/PersonnelMasterPage.Master" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="bSimplex.WebForm1" %>
<asp:Content ID="Content1" ContentPlaceHolderID="cnt_MenuBar" runat="server">
</asp:Content>

Firstly, nothing is showing on my page and I am wondering have I done something wrong?

Secondly, I have CSS styles for this menu bar will these stay the same or because I have moved into Master page will they need to be changed?

Solution

It appears you want to share the menu across multiple pages, so I would try this:

<!DOCTYPE html>
<html>
  <head>
    <title></title>
    <link href="//cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.1.1/css/bootstrap.min.css" rel="stylesheet" media="screen">
    <link href="/css/style.css" rel="stylesheet" media="screen">
  </head>
  <body>
    <div class="bsimplex header-bar left">
        <div class="header-context clearfix header-label">
            <asp:Image ID="bsimplexPTLogo" runat="server" CssClass="small-logo" ImageUrl="~/Images/tracker logoOnly.png" />
            <label class="configurationlbl">Personnel Tracker</label>
        </div>
        <div class="menubarbest">
            <ul id="nav">
                <li  class="current"><a href="bPersonnelTrackerDashboard.aspx" >Home</a></li>
                <li><a href="#">Manager</a>
                    <ul>
                        <li><a href="#">Rota</a></li>
                        <li><a href="#">Holiday Requests</a></li>
                    </ul>
                </li>
                <li><a href="#">Absences</a>
                    <ul>
                        <li><a href="bSicknessForm.aspx">Sickness</a></li>
                        <li><a href="bLatenessForm.aspx">Lateness</a></li>
                        <li><a href="bMedicalLeaveForm.aspx">Medical Appointment</a></li>
                        <li><a href="OtherMedical.aspx">Other</a></li>
                    </ul>
                </li>
                <li><a href="#">Reports</a>
                    <ul>
                        <li><a href="#">Attendance Record</a></li>
                        <li><a href="#">Rota</a></li>
                    </ul>
                </li>
                <li><a href="Admin/Administration.aspx">Admin</a></li>
        </div>
    </div>
    <div>
        <asp:ContentPlaceHolder ID="cnt_Body" runat="server"></asp:ContentPlaceHolder>
    </div>
</body>

Then on the WebForms page, do something like this:

<%@ Page Title="" Language="C#" MasterPageFile="~/Personnel/PersonnelMasterPage.Master" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="bSimplex.WebForm1" %>
<asp:Content ID="Content1" ContentPlaceHolderID="cnt_Body" runat="server">
    <h1>Sickness Form</h1>
    <p>Please fill out the following sickness form...</p>
</asp:Content>