Here’s a top tip when you’re posting pictures in HTML - expect many of you know it already. Sometimes, if the original image is too big, it won’t fit properly on the screen. With the iCrossing internal blog, for example, it ends up overlapping the middle column.
If this happens, you don’t need to manually resize the picture itself - particularly handy if you’re linking to one hosted elsewhere. If you use the visual editor on Wordpress or a similar platform, you can simply drag a corner of the image outline to resize it.
If you use an HTML editor, check the line of code that embeds the image, which might normally look something like “img src=’path to image goes here/image.jpg’”. It may also specify “height=’number in pixels’” and/or “width=’number in pixels’”. Take out the height bit altogether, and change the width bit to “width=’100%’”.
This should scale the picture to the full width of your post, keeping the height in the correct proportion. Obviously, choosing a lower percentage will make the picture smaller still.
