CODEWITHSUNDEEP
jquerycssjstree
Joshua Terrill
Joshua Terrill

Reputation: 2017

Dynamically resizing the width of a div that contains Jstree Tree

I've got the following layout:

<div id="tree" class="jstree"></div>

And it generates a jstree that has multiple levels of ul and li elements. I've got overflow:auto set so that as I expand or collapse the items, scrollbars appears. What I would like to happen is dynamically resize the width of #tree so that as you are expanding items, it will resize so that there would be no horizontal scroll.

Here is a fiddle describing what I'm talking about: http://jsfiddle.net/0xwg3c2c/

Upvotes: 0

Views: 4924

Answers (2)

Edgar Orozco
Edgar Orozco

Reputation: 2782

You only need to change the CSS, use the min-width, and min-height properties like this:

.container {
    border: 1px black solid;
    min-width: 150px;
    min-height: 100px;
    overflow: auto;
}

Upvotes: 0

jono
jono

Reputation: 1842

You can use display:inline-block; to have the element resize based on it's content.

.container {
    display:inline-block;
    border: 1px black solid;
    min-width: 150px;
    min-height: 100px;
}

Upvotes: 1

Related Questions