Thursday, July 30, 2009

How to enter a space between pictures and text using HTML

Here's a quick tip on how to add additional line spaces between text and pictures using html code.

Lets say you have a photo that has text underneath, but no matter what you do, you cannot create a gap between the two by just pressing enter. Try using the <br/> tag.

Example:


Brittany











Now we want to add the <br/> html code to put a space between 'Brittany' and the image.

Here is the code:

Text -><span style="font-size:180%;"
><span style="font-weight: bold;">Brittany</span></span>
Image -><a
> Brittany's Image.jpg (shortened this code for cosmetic purposes)</a>

Adding the
<br/> tag:

Text -><span style="font-size:180%;"><span style="font-weight: bold;">Brittany</span></span>
Insert
<br/> tag here -> <br/>
Image -><a> Brittany's Image.jpg (shortened this code for cosmetic purposes)</a>

So now it looks like:

<span style="font-size:180%;"><span style="font-weight: bold;">Brittany</span></span>
<br/>
<a> Brittany's Image.jpg (shortened this code for cosmetic purposes)</a>

Final Product:

Brittany












Easy fix with a long explanation ;)

No comments: