CODEWITHSUNDEEP
jquerycssheight
Jez D
Jez D

Reputation: 1489

How can I set the height of an element which has been dynamically added to the page

I need to set the height of a container, which is added to the DOM/page via a jquery function.

I have tried using the stylesheet, but it just ignored it and set a height dynamically which is smaller than the contents.

I tried $(element).css('height',470) and $(element).css('height','470px') but neither of these worked.

Upvotes: 1

Views: 56

Answers (2)

user1853181
user1853181

Reputation: 785

There is nothing wrong with your syntax. You probably just need to wait for the DOM (or another function which is loading your element) to finish loading:

$(function() { // Or similar if it's another function loading the element
    $(element).css('height','470px');
});

This will set the height for your element at the given moment, but will not stop any possible 'outside tinkering' with the same value, so also pay attention to that as well.

If neither above gives you the desired effect, it might be possible that you have inadvertently placed a height style with !important somewhere else, and that it overrides your efforts, so replace

$(function() {
    $(element).css('height','470px');
});

with

$(function() {
    $(element).css('height','470px !important');
});

Upvotes: 1

Jez D
Jez D

Reputation: 1489

After the function which adds the element has run, use the following:

$(element).height(247)

This works a treat for me

Upvotes: 0

Related Questions