Geek asks and answers

Space characters after images in Firefox

I came across some weird behavior in Firefox 12. Consider the following HTML:

<!DOCTYPE html>
<img src="resources/csv.png">
<img src="resources/globe.png">
<img src="resources/clock.png">
<img src="resources/key.png">
<img src="resources/delete.png">

When this is displayed, I noticed there is a small space between the first and second images. If I make a “text selection” around all the images, I see there a hidden little white space between them:

wtfspace

I can't think of any reason for this, but I intend to make all my button links, so I also tried this to see if this has any effect. Here's the new code:

<!DOCTYPE html>
<a><img src="resources/csv.png"></a>
<a><img src="resources/globe.png"></a>
<a><img src="resources/clock.png"></a>
<a><img src="resources/key.png"></a>
<a><img src="resources/delete.png"></a>

Once again, here is the output that has been selected. Note that there is a space after each image:

enter image description here

- ? HTML , , Firefox? - , , CSS? - , IE7, , , , . .

EDIT: . , HTML. , .:)

+3
2

- . , !

<img src="one.jpg"><img src="two.jpg">


<a href="#"><img src="one.jpg"></a><a 
href="#"><img src="two.jpg"></a>

, html, .

+3

, .

<img src="resources/csv.png"/><img src="resources/globe.png"/><img src="resources/clock.png"/><img src="resources/key.png"/><img src="resources/delete.png"/>

. , - ...

   <img src="resources/csv.png"/><!--
--><img src="resources/globe.png"/><!--
--><img src="resources/clock.png"/><!--
--><img src="resources/key.png"/><!--
--><img src="resources/delete.png"/>
+4

More articles:


All Articles