Get your CodeRanch badge!*
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 8 in Action this week in the Java 8 forum!
JavaRanch » Java Forums » Engineering » HTML, CSS and JavaScript
Bookmark "UWO (Unidentified Whitespace Object)" Watch "UWO (Unidentified Whitespace Object)" New topic
Author

UWO (Unidentified Whitespace Object)

James
Greenhorn

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

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

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

<a href="http://www.symantec.com">
<img src="img/block.JPG"
type="image/jpeg"
width="170"
height="80"
border="0"
hspace="0"
vspace="0"/>
</a>

</div>
</body>
</html>
[ June 26, 2006: Message edited by: James Douglas ]
Roy Ivar Moe
Greenhorn

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

Hmmmmm.....
Bear Bibeault
Author and ninkuma
Marshal

Joined: Jan 10, 2002
Posts: 60082
    
  65

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] [Bear's FrontMan] [About Bear] [Books by Bear]
James
Greenhorn

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
Greenhorn

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?

Regards,
Roy
 
I agree. Here's the link: http://aspose.com/file-tools
 
subject: UWO (Unidentified Whitespace Object)
 
Similar Threads
Images on Images using CSS
Game Script??
CSS Positioning Issue
Problem hiding div within div
Revisiting DIV