CODEWITHSUNDEEP
javascriptjquerycssweb
mattnham
mattnham

Reputation: 7

Use div's height to determine another div's padding or margin-top

I am using the following jQuery to work out the width of a div (thats in %), to then tell another div to set it's height to that in pixels.

<script>
    $("#top").height($("#left").width());
    $("#bottom").height($("#left").width());
</script>

It's working really well. Now my next problem is, that I want my div called 'wrapper' to have a padding-top or margin-top of the pixel value it returns for the height. I tried changing 'height' to 'padding-top', but that didn't seem to work.

The end result is a web page with a series of 4 black div acting as a border around the edge, it calculates 5% of the with of the window, and that determine's the pixel value for how how the top and bottom black div's are. That way it's exactly even. Now I want my inside wrapper div, to start exactly that far down the web page too.

Upvotes: 0

Views: 1314

Answers (2)

Muhammad Bilal
Muhammad Bilal

Reputation: 3018

Tested Solution: Find height of a div and use it as margin top of another div.

$('.topmargindiv').css('margin-top', function() {
    return $('.divheight').height();
});

Upvotes: 0

designcise
designcise

Reputation: 4372

Use the jQuery outerWidth function to retrieve the width inclusive of padding, borders and optionally margin as well (if you send true as the only argument to the outerWidth method).

Upvotes: 1

Related Questions