Dynamically change the size of a div based on content

Question

I have a view that slides into a div using angular. My problem is, the content is dynamic and the height of that view is going to change. How can I set the height of my outer div to fit the height of the inner div? Also, my inner div has to have position: absolute in order to use the css sliding class that slides the view into place.

Also worth mentioning that if I log:

console.log($("#item-container").height());

I get 163px which is the height of one category column in the row

Outer div

<div data-ng-app="items">
    <div ng-controller="ParentController">
        <div data-ng-view class="slide-left">

        </div>
    </div>
</div>

Inner div

<div class="container" id="item-container">
    <div data-ng-repeat="c in categories">
        <div ng-class="{true: 'row'}[$index % 3 == 2]">
            <div class="col-sm-4">
                <div class="row">
                    <label>{{c.Name}}</label>
                </div>
                <a class="row" href="#!/categories/{{c.CategoryID}}">
                    <img src="/images/thumb/NoImageAvailable.jpg" class="categoryBackground" />
                </a>
            </div>
        </div>
    </div>
</div>

possible duplicate of [Dynamically changing height of div element based on content](http://stackoverflow.com/questions/614881/dynamically-changing-height-of-div-element-based-on-content) — TylerH, May 05 '14 at 15:34
@TylerH I saw this questions and this does not answer my question — Dominick Piganell, May 05 '14 at 18:39

score 1 · Answer 1 · answered May 05 '14 at 15:36

1

set

<div style="display:inline-block"></div> for all

else use css

div
{
    display:inline-block;    
}

answered May 05 '14 at 15:36

Vivek MVK

1,155
10
19

1

Please don't suggest that people use deprecated methods such as inline styles in the future. – TylerH May 05 '14 at 18:44
Then what is the purpose of it? Are the people using it useless? – Vivek MVK May 06 '14 at 06:45
It is deprecated, which means browsers will stop supporting it in the future. It also leads to difficult-to-maintain code, which is not a habit you should be teaching, especially not at Stack Overflow. – TylerH May 06 '14 at 13:03
Then what would be the substitute for it? – Vivek MVK May 06 '14 at 13:11
Your second suggestion of CSS is quite adequate. – TylerH May 06 '14 at 13:13
oh.. you mean that "inline" :) well.. I was thinking for long time of display: "inline"... – Vivek MVK May 06 '14 at 13:15
No, I just meant using CSS styles *inside* HTML markup. I only know to call this "inline styles" :-) – TylerH May 06 '14 at 13:16
Hmmm.. Thank you... but inline-styles are helpful where we have no need to create id's – Vivek MVK May 06 '14 at 13:18
"No need" or "No desire" ;-) – TylerH May 06 '14 at 13:23

Dynamically change the size of a div based on content

1 Answers1