CODEWITHSUNDEEP
javascripthtmlcsspositioningcss-position
copenndthagen
copenndthagen

Reputation: 50722

Layout issue with absolute positioned div

I have a parent/child divs coded as;

<div class="classes scrollable">
<div class="items">
....Some content
</div>
</div>

My CSS is;

.scrollable {
    overflow: hidden;
    position: relative;
    width: 100%;
}
.scrollable .items {
    clear: both;
    position: absolute;
    width: 20000em;
}

Actually my "items" div has it's "left" position changed dynamically via JS (for kind of carousel effect...scrolls to left/right)

Also bcoz it is an absolute div, I cannot get the parent div "scrollable" to expand as per "items" content.

How do I fix this issue ?

Upvotes: 0

Views: 130

Answers (2)

ANeves
ANeves

Reputation: 6365

What keeps you from not making .items absolutely positioned?
Can't you just use something like margin-left: -100px, instead of left: -100px;?

Working example of what I mean: http://jsfiddle.net/fk5Q2/

Upvotes: 1

Tetaxa
Tetaxa

Reputation: 4393

You can set height on the .scrollable. The inner scrolling div is just one row, right?

Upvotes: 1

Related Questions