Full width image w/ divs over 960px wide responsive content

Hi everyone,

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.

make responsive slider work in both computer and smartphone

Hello guys Smile
I am making a website in Wordpress. the theme brought a slideshow function but it is important to me that this slideshow view in mobile devices (such as Blackberry) in its 100% width, it is currently being seen by 50% because the image is to wide, so it has to be fixed using CSS.

Alternatively because I have not found help so far I installed a plugin that it is perfectly working in Blackberry but in desktop the slideshow is the monitor screen is wider it goes to the extreme left of the browser window and the text to the extreme right part.

Syndicate content