17 Apr Full Width Containers in Limited Width Parents
Working in a project for my client. She want to make a container full width
Although the visual composer has the option (Stretch row) but not working. then i found a solution on CSS Tricks its on of the most favorite site for me. cause i found issues solution from here.
Solved the issue with 2 line of css by using calc & vw and it works in IE9+
margin-left: calc(-100vw / 2 + 500px / 2);
margin-right: calc(-100vw / 2 + 500px / 2);
For Better result we should crate an id or class for the container. my case i have assigned .full-width-row class.
Here is the Result:
For your Screen adjustment calc -100vw value can be adjust calc -50vw with any value, adjust until the object is not visible correctly
Thanks for Reading the Post. If you have any question Comment out.