File APIs for Java Developers
Manipulate DOC, XLS, PPT, PDF and many others from your application.
The moose likes HTML, CSS and JavaScript and the fly likes UWO (Unidentified Whitespace Object) Big Moose Saloon
  Search | Java FAQ | Recent Topics | Flagged Topics | Hot Topics | Zero Replies
Register / Login

Win a copy of Java Interview Guide this week in the Jobs Discussion forum!
JavaRanch » Java Forums » Engineering » HTML, CSS and JavaScript
Bookmark "UWO (Unidentified Whitespace Object)" Watch "UWO (Unidentified Whitespace Object)" New topic

UWO (Unidentified Whitespace Object)


Joined: Jun 23, 2006
Posts: 4
I have an image next to a span and there's whitespace between them. Why?

<div style="width: 500px;">

<span style="background-color=red; float: right;width: 328px">A</span>

<a href="">
<img src="img/block.JPG"

[ June 26, 2006: Message edited by: James Douglas ]
Roy Ivar Moe

Joined: Jun 22, 2006
Posts: 21
What is 500px - 328px?

Bear Bibeault
Author and ninkuma

Joined: Jan 10, 2002
Posts: 63873

You're trying to do too much with hard-coded dimensions. Let the browser lay out the elements and be sure to account for line-end characters as discussed in your other post.

[Asking smart questions] [About Bear] [Books by Bear]

Joined: Jun 23, 2006
Posts: 4
Ok, Roy. I deserved that. I didn't explain the situation well enough. When the above code is put in IE, the span (328px) and image (170px) won't fit side-side in the div (500px), though there should be 2 pixels to spare between them. When I decrease the span from 328 to 327, they fit. So, there are 3 pixels of "Unidentified Whitespace" between them.

As it turns out, I later came across a discussion thread where someone described a famous "3 pixel jog" in IE that occurs when a floated element is placed next to a non-floated element. I floated both elements and they fit as expected.

Bear, this code wasn't actually something I was trying to write for some production use. I came across the issue haphazardly during some CSS/DOM study and needed an answer to validate/refute/add-to what I learned.
Roy Ivar Moe

Joined: Jun 22, 2006
Posts: 21

I observed the same behaviour when I tried your example in IE and in FF.
Sorry, can't tell you what causes this though. Probably another IE bug, right?

I agree. Here's the link:
subject: UWO (Unidentified Whitespace Object)
jQuery in Action, 3rd edition