CODEWITHSUNDEEP
htmlcss
mrmagooey
mrmagooey

Reputation: 4982

Child div with absolute position parent

The <p> child of a position:absolute div is arranging so that it appears to be attaching to the top left of the absolute parent div (below image showing output from chrome inspector).

child and absolute div

As I understand it, the child should be within the 'flow' of the parent div, and so should be within the confines of the parent div.

CSS is:

.modal{
    position:fixed;
    width:auto;
    height:100px;
    left:50%;
    top:75%;
    z-index:52;
    background-color: #2a333c;
}

.modal p{
    position:relative;
}

HTML is:

<div class="modal">
<p>new user template</p>
</div>

NB The greying effect is caused by another fixed div that is alongside the absolute modal div with a lower z-index value, but is neither parent nor child of the 'modal' div.

Upvotes: 0

Views: 820

Answers (1)

Quentin
Quentin

Reputation: 944443

As I understand it, the child should be within the 'flow' of the parent div, and so should be within the confines of the parent div.

Yes, and all else being equal, it will be.

Other style rules can influence its position though.

Upvotes: 1

Related Questions