Remove From My Forums

Why am I getting this error? "content is not supported outside script or asp.net regions"

Question
0

Sign in to vote

User1938579050 posted

https://jsfiddle.net/poy7decm/1/

I'm getting the error message ""content is not supported outside script or asp:content regions"

Does anyone know what the problem is?

Sunday, January 12, 2020 7:27 AM

All replies

User409696431 posted

What you are showing is the entire html page structure outside of content regions, for a page that uses a master page. That makes no sense. The master page will have the page's HTML structure, and one or more content regions where you add the page-specific content. The page-specific content does not contain page structure that is already in the master page: no <html>, no <head>, no <body>. It only contains html elements that make sense where the content regions are. Look at your master page and see the structure.

Typical structure for a page using a master page (just an example, not all scripts, etc included). Notice it does not have the html tags that will be provided by the master page:

<%@ Page Title="Contact" Language="C#" MasterPageFile="~/Site.Master" AutoEventWireup="true" CodeFile="Contact.aspx.cs" Inherits="Contact" %>

<asp:Content ID="BodyContent" ContentPlaceHolderID="MainContent" runat="server">
    <h2><%: Title %>.</h2>
    <h3>Your contact page.</h3>
    <address>
        One Microsoft Way<br />
        Redmond, WA 98052-6399<br />
        <abbr title="Phone">P:</abbr>
        425.555.0100
    </address>

    <address>
        <strong>Support:</strong>   <a href="mailto:Support@example.com">Support@example.com</a><br />
        <strong>Marketing:</strong> <a href="mailto:Marketing@example.com">Marketing@example.com</a>
    </address>
</asp:Content>

The corresponding master page, which contains the doctype, html, head, body and form tags, as well as common content (menu, footer):

<%@ Master Language="C#" AutoEventWireup="true" CodeFile="Site.master.cs" Inherits="SiteMaster" %>

<!DOCTYPE html>

<html lang="en">
<head runat="server">
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
</head>
<body>
    <form runat="server">
        <div class="navbar navbar-inverse navbar-fixed-top">
            <div class="container">
                <div class="navbar-header">
                    <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
                        <span class="icon-bar"></span>
                        <span class="icon-bar"></span>
                        <span class="icon-bar"></span>
                    </button>
                    <a class="navbar-brand" runat="server" href="~/">Application name</a>
                </div>
                <div class="navbar-collapse collapse">
                    <ul class="nav navbar-nav">
                        <li><a runat="server" href="~/">Home</a></li>
                        <li><a runat="server" href="~/About">About</a></li>
                        <li><a runat="server" href="~/Contact">Contact</a></li>
                    </ul>
                </div>
            </div>
        </div>
        <div class="container body-content">
            <asp:ContentPlaceHolder ID="MainContent" runat="server">
            </asp:ContentPlaceHolder>
            <hr />
            <footer>
                <p>&copy; <%: DateTime.Now.Year %> - My ASP.NET Application</p>
            </footer>
        </div>
    </form>
</body>
</html>

Sunday, January 12, 2020 1:24 PM

User1535942433 posted

Hi Joe_p123,

As far as I think,Master pages allow you to create a consistent look and behavior for all the pages (or group of pages) in your web application. And the content should be added in the <asp:content>.

The master page contains a placeholder tag <asp:ContentPlaceHolder> for individual content.

The id="xxxx" attribute identifies the placeholder, allowing many placeholders in the same master page.

More details,you could refer to below codes:

Masterpage:

<asp:ContentPlaceHolder ID="head" runat="server">
    </asp:ContentPlaceHolder>
    <script src="Scripts/jquery-3.0.0.js"></script>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css">
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js"></script>
    <style>
        .TheTennisCentre {
            text-align: center;
            text-decoration: underline;
        }

        .TennisCentreLogo {
            ;
            top: 0px;
            right: 0px;
        }

        *, *::before, *::after {
            margin: 0;
            padding: 0;
            box-sizing: border-box;
        }


        .dropbtn, .navbar a {
            background-color: black;
            color: white;
            padding: 16px;
            font-size: 16px;
            border: none;
            text-decoration: none;
            font-family: Arial, Helvetica, sans-serif;
        }

        .dropdown {
            ;
            display: inline-block;
            min-width: 146px;
        }

        .dropdown-content {
            display: none;
            ;
            background-color: #f1f1f1;
            min-width: 160px;
            box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
            z-index: 1;
        }

            .dropdown-content a {
                color: white;
                padding: 12px 16px;
                text-decoration: none;
                display: block;
            }

                .dropdown-content a:hover {
                    background-color: #ddd;
                }

        .dropdown:hover .dropdown-content {
            display: block;
        }

        .dropdown:hover .dropbtn, .navbar a:hover {
            background-color: #3e8e41;
        }

        .dropdown-toggle {
            width: 100%;
        }

        .currentdate {
            ;
            right: 36px;
            top: 160px;
        }

        table, th, td {
            border: 1px solid black;
            align-content: center;
        }

        .heading2center {
            text-decoration: underline;
            font-size: 35px;
        }

        .courtinfoWG {
            text-decoration: underline;
            font-size: 25px;
        }

        .courtinfo2WG {
            text-align: center;
        }

        .prices {
            float: right;
        }

        .courtinfoEG {
            text-decoration: underline;
            font-size: 25px;
        }

        .courtinfoSG {
            text-decoration: underline;
            font-size: 25px;
        }

        .eventdate {
            text-align: center;
            display: flex;
            flex-direction: row-reverse;
            flex-direction: column-reverse;
        }

        .flex-container {
            flex-direction: column-reverse;
            justify-content: flex-start;
        }

        .COTM {
            text-align: center;
        }

        .COTMinfo {
            text-align: center;
        }

        .subscribe,
        .login {
            ;
            top: 0px;
            width: 88%;
            padding: 18px 6% 60px 6%;
            margin: 0 0 35px 0;
            background: rgb(247, 247, 247);
            border: 1px solid rgba(147, 184, 189,0.8);
            box-shadow: 0pt 2px 5px rgba(105, 108, 109, 0.7), 0px 0px 8px 5px rgba(208, 223, 226, 0.4) inset;
            border-radius: 5px;
        }

        .login {
            z-index: 22;
        }

        .formtext {
            font-size: 20px;
            font-weight: bold;
            padding: 0px 16px;
            margin-left: auto;
            margin-right: auto;
        }

        .courtinfos {
            margin: 0px 0px 0px 790px;
        }

        .courtinfos2 {
            align-content: center;
        }

        .Availblecourtstext {
            text-decoration: underline;
            font-size: 25px;
            font-weight: bold;
            padding: 0px 16px;
            margin: 0px 0px 500px 0px;
            text-align: center;
        }

        .westgreenwich {
            text-align: center;
            margin: 500px;
            0px 0px 0px;
            text-decoration: underline;
            font-size: 20px;
        }

        .container {
            ;
            display: inline-block;
        }

        .contained {
            margin: 0 auto;
            ;
        }

        .centered {
            text-decoration: underline;
            font-size: 25px;
            padding: 0px 16px;
            margin: 0px 0px 500px 0px;
            text-align: center;
        }

        .flex-grid {
            width: 400px;
        }

        .form-row {
            display: flex;
            justify-content: flex-start;
        }

            .form-row > label {
                flex: 1;
            }

            .form-row > input {
                flex: 2;
            }
    </style>

 <div>
            <asp:ContentPlaceHolder ID="ContentPlaceHolder1" runat="server">
            </asp:ContentPlaceHolder>
        </div>

Contentpage:

<%@ Page Title="" Language="C#" MasterPageFile="~/Site3.Master" AutoEventWireup="true" CodeBehind="WebForm49.aspx.cs" Inherits="Demo.WebForm49" %>

<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="server">
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" runat="server">
    <div class="TheTennisCentre">
        <h1>Welcome to the Tennis Centre!</h1>
    </div>
    <div class="TennisCentreLogo">
        <img src="image/image5.jpg" width="150" height="150" alt="TennisCentreLogo" />
    </div>
    <div class="currentdate">
        <p>
            <script> document.write(new Date().toLocaleDateString()); </script>
        </p>
    </div>
    <div class="container-fluid">
        <div class="row">
            <div class="col-xs-12">
                <div class="navbar">
                    <a class="active" href="Home.aspx">Home</a>
                    <a href="Tournament.aspx">Tournament</a>
                    <a href="Courtofthemonth.aspx">Court of the Month</a>
                    <a href="Booking.aspx">Booking</a>
                    <a href="Register.aspx">Register</a>

                    <div class="dropdown">
                        <button class="dropbtn">Login/Profile</button>
                        <div class="dropdown-content">
                            <a href="Bookings.aspx">Bookings</a>
                            <a href="Personal Information.aspx">Personal Information</a>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <div class="centered">
        <p class="Availablecourts"><strong>Our Available Courts!</strong></p>
        <br>
        <img src="image/image5.jpg" /><br>
        <img src="image/image5.jpg" /></div>
</asp:Content>

Result:

More details,you could refer to below articles:

http://www.wideskills.com/aspnet/master-and-content-pages

Best regards,

Yijing Sun

Monday, January 13, 2020 4:32 AM

Asked by:

Why am I getting this error? "content is not supported outside script or asp.net regions"

Question

All replies