 |
|
 |
|
| Franscape
Development Tutorials |
You are currently viewing the Debugging: Removing Space Between Images In IE tutorial, in the 'HTML' category.
-----------------
Since IE hasn't yet fallen off the face of the earth, we have yet another problem to deal with:
Note the structure below:
<div>
<img src="img1.gif">
<img src="img2.gif">
<img src="img3.gif">
<img src="img4.gif">
</div>
|
Rendering this in IE often yields spaces around these images (cannot be resolved by CSS), which -- if it isn't intended -- is destructive to any layout and, thus, any developer's patience.
IE's engine considers each image as it does a block of text, such that, in the following structure:
We would expect the result to be:
"...
AAA BBB CCC
..."
and not:
"...
AAABBBCCC
..."
We fix this by commenting out this whitespace, as it were, moving it into unrendered areas:
<div><!--
--><img src="img1.gif"><!--
--><img src="img2.gif"><!--
--><img src="img3.gif"><!--
--><img src="img4.gif"><!--
--></div>
|
-----------------
· Discuss this and other tutorials on the FS Forums.
· Return to the
HTML tutorial listing.
· Return to the Tutorial Overview.
· Return Home.
|
|
|
|
|
|
|
 |