width() and height() after form is appended to inline element

Reported by:	tuupola	Owned by:
Priority:	major	Milestone:	1.2.3
Component:	core	Version:	1.2.1
Keywords:	width, height, safari, firefox, form	Cc:
Blocked by:		Blocking:

Description

Symptons

If inline element is appended a form element and later this form element is removed, all subsequent calls to $(elem).width() and $(elem).height() return 0.

Block level elements seem to be unaffected. See example page of the bug.

Atleast Safari 3.0.4 and FireFox 2.0.0.11 are affected.

Workaround

Problem seems to be fixed by changing the code starting at line 800 from:

if ( jQuery(elem).is(":visible") ) {
  getWH();			    
} else {
  jQuery.swap( elem, props, getWH );			    
}

to:

if ( !jQuery(elem).is(":visible") ) {
  getWH();			    
} else {
  jQuery.swap( elem, props, getWH );			    
}

Although this for sure will break lots of other things. Should be a good starting point for debugging. I do not personally have understanding what that code does.

Attachments (0)

Change History (2)

Changed January 22, 2008 06:58PM UTC by davidserduke comment:1

milestone:	1.2.2 → 1.2.3
version:	1.2.2 → 1.2.1

This same problem appears to have been in 1.2.1 so this isn't new. I think it is caused by invalid markup since form is a block level element and is being placed in an inline element which is confusing the browser.

For more detail see this thread:

http://groups.google.com/group/jquery-dev/browse_thread/thread/db6fed2125f19aee

Changed February 17, 2008 06:21PM UTC by brandon comment:2

resolution:	→ invalid
status:	new → closed

As David already mentioned, this is invalid HTML. An display: inline element cannot be the parent of a display: block parent.

Side navigation