I have just finished the design of one new project, and are now about to start programing it into html/css but can't figure out, how to do it. For a better understanding, here a quick sketch:
The content should be 960px wide and responsive, which in theory shouldn't be a problem to program. However, I am looking to get one image which is 100% wide, and this image should be covered by two DIVs with each an opacity of 50%. Each of these two DIVs will contain some text and a button.
A further issue is the footer. As you can see, I have designed two full width colored rectangles but the content should only be within the centered 960px - just like the main content above.
Could anyone please explain me how to implement this design into css/html?
Thank you in advance!