Search  


Adding space around images in HTML 
Friday, September 24, 2021, 05:43 AM
Posted by Administrator
A pretty common question when working with HTML is how to add space arohnd an image when the image is surrounded by text. Normally align= left or align=right will position the image on either side of the text. Althere are several options...I will list two here as I even find myself using these options many times. Appearance wise, it’s a judgment call as to how much padding you want to place around your image relative to the text. You mostly want to avoid the appearance of text touching an image. Padding is a great way to prevent that from happening.

Option 1: Add extra whitespace around your image.

Option 2: Instead of using 'align=left' or 'align=right', I used float: left;
<img style=”float: left; padding: 3px 3px 0px 3px;” src=”image_name_here.gif” width=”80″ height=”80″ />

The option above allows you to add padding on each side of an image.

Note: If this article has helped, please feel free to share. If you'd like to participate and post an article, please send your submissions to info@certificationpoint.org

Start Your STUDENT experience at CertificationPoint!
Student Experience Builders

Find us on Twitter: https://twitter.com/certpointorg
Find us on Facebook: https://www.facebook.com/CertificationPoint1/



2 comments ( 168 views )   |  permalink   |  $star_image$star_image$star_image$star_image$star_image ( 3 / 493 )

<<First <Back | 1094 | 1095 | 1096 | 1097 | 1098 | 1099 | 1100 | 1101 | 1102 | 1103 | Next> Last>>







Share CertificationPoint & Stay Informed Socially About EduTech?