I have created a custom master page in SP2013 using design manager. The structure is as follows:-
The issue is when the web part in the "content" div exceeds the browser window width the header and footer does not stretch correspondingly. How do we fix it with design and CSS. Jquery is not an option since the content width does not come up consistently. I resolved it using Jquery but if there are 2 web parts side by side that won’t work.
All the container div classes show fixed width on page load even if the content exceeds the browser window.
I tried CSS styles like width: auto which also didn’t work.
Attaching an image for better clarity.