Nesting CSS classes and tags

Question

I’m developing a site, Administrative side, already set up Masterpage and now defining the Layout of the pages daughters, where I came across a problem, which I need help. This is the code that matters on the daughter page:

<asp:Content ID="ContentFormAdmin" ContentPlaceHolderID="ContentPlaceHolder1" runat="server">
    <div id="FormAdminBase" class="container">
        <div class="row">
            <header id="HeaderFormAdmin">
                <h2>Cadastro dos Serviços Prestados</h2>
            </header>
        </div>
    </div>
</asp:Content>

So I created the CSS as follows:

#FormAdminBase {
    background-color: #285ce6;
    max-width: 1170px;
    margin-left: auto;
    margin-right: auto;
    margin-top: 5px;
    margin-bottom: 3px;
    text-align: center;
    font-size: 18px;
    color: whitesmoke;
    padding: 15px;
    height: calc(100% - 5px);
    border: 3px red ridge;
}

#FormAdminBase h2 {
    text-align: left;
    color: white;
    text-shadow: 4px 4px 5px rgba(31, 54, 99, 0.73);    
}

The thing is that "Registration of Services Provided" is aligned to the left of the browser and not to the left, inside the "Formadminbase" as I imagined you would be. I wonder how to nestle everything in "Formadminbase".

I’m using ASPX, C#, with Bootstrap!

I’ve researched about and I can’t find anything targeted!

Answer 1

Thanks for the help Wtrmute! I did as you instructed and saw that my mistake was using the <header>, so I took him out and put in a div, then worked as expected.

Stayed like this:

<asp:Content ID="ContentFormAdmin" ContentPlaceHolderID="ContentPlaceHolder1" runat="server">
    <div id="FormAdminBase" class="container">
        <div class="row">
            <div id="HeaderFormAdmin">
                <h2>Cadastro dos Serviços Prestados</h2>
            </div>
        </div>
    </div>
</asp:Content>

Well, it was this, the header was right, but to be used in Masterpage and not those who inherit it.

Following Anderson’s lead, I want to clarify that header is dealt with in the CSS as follows:

header {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    height: 60px;
}

Thus, when declaring the use on the daughter, would give the error reported initially.

Once again, my thanks! Always learning!