O'Reilly logo

HTML5 and CSS3: Visual QuickStart Guide, Seventh Edition by Bruce Hyslop, Elizabeth Castro

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

Specifying Image Size

Sometimes when you load a Web page, you see the text first, and then when the images load a few moments later, the text jumps around to accommodate them. This happens because the size of the image is not specified in the HTML.

When a browser gets to the HTML code for an image, it must load the image to see how big it is and how much space must be reserved for it. If you specify the image’s dimensions, the browser will reserve the space and can fill in the text around the image as the image loads, so that your layout will remain stable as your page loads.

You can use either your browser or your image editing program to get the exact dimensions of your image.

Browsers will also stretch or shrink an image to fit the size you’ve ...

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, interactive tutorials, and more.

Start Free Trial

No credit card required