I can not seem to get a 100% width background color after Position: Absolute on my code?-CodePudding

.left-side p {
  position: absolute;
  left: 50%;
  top: 95%;
  width: 100%;
background-color:black 
}

am trying to add a background color but doesn't span 100% on the page. Why? How can i solve this problem.

CodePudding user response：

remove the left property and it will work. but also remember that the parent width needs to be 100% as well.

CodePudding user response：

you need to remove property left and property top and add position relative to its parent container.

 .left-side p {
        position: absolute;
        background-color: black;
        width:100%;
    }

And HTML Code

<div  style="position: relative;">
    <p>Lorem ipsum dolor sit amet.</p>
</div>