Bug Tracker

#125 closed bug (invalid)

Opened August 12, 2006 03:10PM UTC

Closed October 26, 2006 02:23PM UTC

Last modified March 15, 2012 05:53PM UTC

Nested in display:none gives width()/height()=0

Reported by: dave.methvin@gmail.c Owned by:
Priority: undecided Milestone:
Component: ajax Version:
Keywords: "" Cc: ""
Blocked by: Blocking:
Description

Given this HTML:

<div id="outer" style="display:none">
  <div id="inner" style="width:10px; height:11px"> </div>
</div>
  • $("#inner").width() returns 0
  • $("#inner").css("width") returns "10px"
  • $("#inner").css("display") returns "block"

If #outer is display:block then #inner returns width()==10. It looks like (in IE6/FF at least) any display:none parent causes width()/height() to return 0. There is a workaround in $.css for the element itself being display:none but since #inner returns display:block it's not in play.

The only fix I can see to return the actual width()/height() is to crawl up the entire tree looking for display:none elements, temporarily setting them all to display:block. If this was implemented I think it would be best to make it optional and require a boolean to request tree spelunking: $("#inner").height(true). Maybe it would be best to just document the behavior as it currently is?

Attachments (0)
Change History (2)

Changed August 15, 2006 04:50AM UTC by john comment:1

milestone: → 1.0
resolution: → wontfix
status: new → closed
version: → 1.0

This is due to the fact that browsers won't report a valid width and height for elements that have a display: none. The fix for this is to use .css() - .width() uses .curCSS(), which is quite different.

curCSS returns the current value of the element.

css returns the optimal value of the element (e.g. the full height, even though the element isn't visible).

So, long story short, if you need the full height/width - please use .css("height")/.css("width").

Changed October 26, 2006 02:23PM UTC by joern comment:2

component: → ajax
priority: → blocker
resolution: → invalid
status: reopened → closed
type: → bug

SPAMPOLICE