HTML and CSS Reference
In-Depth Information
5.2.6.12. Problems with height and width
Although the
height
and
width
attributes for the
<img>
tag can improve
performance and let you perform neat tricks, there is a knotty downside
to using them. The browser sets aside the specified rectangle of space
to the prescribed dimensions in the display window, even if the user has
turned off automatic download of images. What the user often is left
with is a page full of semi-empty frames with meaningless picture-place-
holder icons inside. The page looks terribly unfinished and is mostly use-
less. Without accompanying dimensions, on the other hand, the browser
simply inserts a placeholder icon inline with the surrounding text, so at
least there's something there to read in the display.
We don't have a solution for this dilemma, other than to insist that you
use the
alt
attribute with some descriptive text so that users at least
know what they are missing. We do recommend that you include these
size attributes because we encourage any practice that improves display
performance.
5.2.6.13. The hspace and vspace attributes
Graphical browsers usually don't give you much space between an im-
age and the text around it. And unless you create a transparent image
border that expands the space between them, the typical 2-pixel buffer
between an image and adjacent text is just too close for most designers'
comfort. Add the image into a hyperlink, and the special colored border
will negate any transparent buffer space you labored to create, as well
as drawing even more attention to how close the adjacent text butts up
against the image.
The
hspace
and
vspace
attributes can give your images breathing room.
With
hspace
, you specify the number of pixels of extra space to leave
between the image and text on the left and right sides of the image; the
vspace
value is the number of pixels on the top and bottom:
<img src="pics/kumquat.gif" align=left>
The kumquat is the smallest of the citrus fruits, similar
