Make an inner div full width in CSS

Make an inner div expand to the full-width of the page.

When a div is inside another div, adding width: 100% will only stretch it to the width of its container. To make the stretch to the full width of the page (or viewport), use this:

.stretch-full-width { width: 100vw; max-width: 100vw; margin-left: calc(50% - 50vw); /* setting left margin as 50% of parent div's margin moves this div to the middle of the page. Then pull it back by a width that is half of the page's entire width. */ }
Code language: CSS (css)






Leave a Reply

Your email address will not be published. Required fields are marked *