let a left div vanish behind the left browser border

[Mikeymore]

I made a sketch of what I want: http://jsfiddle.net/Mikeymore/8f6xd/

What I want is the blue and the green divs centered on the browser and perfect aligned above eachother. In the red and pink left and right divs there will be 2 image slideshows (for in the background) In the wrapper is the main site. They may be vanish when the browser is smaller.

Is it possible in CSS to center the 2 middle divs and give the left and right div a fixed width (300px) -> and when the browser is smaller that the left div will move out of the browser (like you can with rescaling the browser for the right side of the site). Now the left side of the red div stays always in the left side of the browser. I want the green and blue divs to be on the left corner when scaling down the browser.

Is that even possible in CSS? The Joomla module for the slideshow left and right generates divs to put the slideshow in. Or must it be something in javascript?

Thanks in advance!

[Paulie_D]

Like this? – http://codepen.io/Paulie-D/pen/kxleK

[jimmy]

Forked Paulie_D’s pen.

http://codepen.io/jimmythenice/pen/eJdhb

Added stuff for wrapper, now the red div hides behind a border as you wanted.

[Mikeymore]

Thanks both!

Thats indeed what I tried to make.

[Author]

Posts