CODEWITHSUNDEEP
css
Ilya Zharkov
Ilya Zharkov

Reputation: 439

CSS positioning and overflow:hidden

I have a #container div which wraps all content. And #slides-wrap div which is inside #container. I don't know width of #sliders-wrap, but I know size of every .slide in it (slides number are unbounded). Also part of #slides-wrap that overflows screen must be hidden. See attached image as example.

Is it real to do?

enter image description here

Upvotes: 0

Views: 131

Answers (2)

Chưa biết
Chưa biết

Reputation: 969

set z-index for div:

#container
{
    overflow:hidden;
    z-index:2;
    position: relative;
    width: your-value
}

#container #slides-wrap
{
    width:your-value; /*(1000px or more)*/
    z-index:1;
    position: relative;
}

#slides-wrap .slide
{
    width:100px /*your value*/
}

Demo: demo:

Upvotes: 0

The Lazy Log
The Lazy Log

Reputation: 3574

Yes, it is possible, you just need to give your #slides-wrap with following properties

display: inline
white-space: nowrap;

Check this out: http://jsfiddle.net/sv3a4522/

Upvotes: 1

Related Questions