Go Premium for a chance to win a PS4. Enter to Win

x
  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 997
  • Last Modified:

jQuery: Test if height greater than min-height

How can I test if the actual height of a div is greater than its minimum height?
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Example</title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>

<style type="text/css">

#d1, #d2 {
width: 120px;
min-height: 200px;
border: 1px solid red;
margin: 20px;
}

</style>
</head>
<body>

<div id="d1">
Hello World
</div>

<div id="d2">
Tdsafads jkadsh kdjsh jkdash kads hakdjsh adkjs hdsjk hafdsj fads jkadsh kdjsh jkdash kads hakdjsh adkjs hdsjk hafdsj fads jkadsh kdjsh jkdash kads hakdjsh adkjs hdsjk hafdsj 
Tdsafads jkadsh kdjsh jkdash kads hakdjsh adkjs hdsjk hafdsj fads jkadsh kdjsh jkdash kads hakdjsh adkjs hdsjk hafdsj fads jkadsh kdjsh jkdash kads hakdjsh adkjs hdsjk hafdsj 
</div>

<script type="text/javascript">

alert('jQuery should be used to test if the height of #d1 height is greater than its min-height')
alert('jQuery should be used to test if the height of #d2 height is greater than its min-height')

</script>

</body>
</html>

Open in new window

0
hankknight
Asked:
hankknight
1 Solution
 
Gurvinder Pal SinghCommented:
var d1 = $("#d1");
if ( d1.css("min-height")  < d1.css("height") )
or
if ( d1.css("min-height")  < d1.height() )
or
if ( d1.css("min-height")  < d1.innerHeight() )
0

Featured Post

Concerto's Cloud Advisory Services

Want to avoid the missteps to gaining all the benefits of the cloud? Learn more about the different assessment options from our Cloud Advisory team.

Tackle projects and never again get stuck behind a technical roadblock.
Join Now