When a parent <div> has no specified width and a child <div> has a fixed width, what CSS/HTML rules cause the parent <div> to only be as wide as the window rather than the child's fixed width?
In the code snippet below, the parent <div> has a background color of red, while the child is much wider than the window.
If you run the snippet and scroll to the right, you'll notice that the red background of the parent is only as wide as the window itself, despite the child being wider.
#parent {
background-color:red;
}
#child {
width:1000px;
}<div id="parent"><div id="child">Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world Hello world</div></div>Is there an easy way in CSS to ensure that the parent expands to at least the same size as the child without explicitly setting the size using something like min-width:1000px