How Can I Set the Width of a Fixed Positioned Div to Match its Parent Container?

Issue with Setting Width of Positioned Fixed div

In an attempt to assign a width of 100% to a "position: fixed" div, a dilemma arises where the element persists in adopting the width of the browser window or document. Despite defining a parent div with a specific width, the fixed div fails to adhere to it.

To rectify this issue, apply the style attribute "width:inherit" to all divs nested within the parent div. This solution is demonstrated in the following HTML and CSS code:

<div>

#container {
    width: 800px;
}

#fixed {
    position: fixed;
    width: 100%;
}

#fixed * {
    width: inherit;
}

By specifying "width:inherit" for the child elements of the fixed div, they inherit the width of their parent, ensuring alignment with the intended dimensions.

The above is the detailed content of How Can I Set the Width of a Fixed Positioned Div to Match its Parent Container?. For more information, please follow other related articles on the PHP Chinese website!