Thursday, December 3, 2009

Picture with text around it?

like on peoples myspace about me's.



how do i make a picture on the left with text on the right?



Picture with text around it?

You need to float your image. Using align="left" will only set your image to the left but not cause the text to wrap around it.



example:



%26lt;p%26gt;



鑱借伣%26lt;img src="foo.jpg" alt="A description." style="float: left; margin-right: 5px;" /%26gt;



鑱借伣 Your text here. In order to fully see the effect of this code, the text needs to be a bit long so that you can see it wrap around the image.



%26lt;/p%26gt;



I added a margin-right: 5px so that the text doesn't come too close to the edge of the image. You can change the value "5px" as you wish.



If you intend to set the image to the right, use "float: right; margin-left: 5px".



Cheers! :)



Picture with text around it?

%26lt;img src="url code goes here" align="left"%26gt;Put what ever text you want here



*take not the align="left" forces the next to align right next to picture



Picture with text around it?

It all has to deal with the alignment.



In this case you will need to align the text right, and your photograph to the left. For the code you can visit this website.



http://www.activejump.com/h-1.shtml



I hope that helped.



Picture with text around it?

In the about me text you can enter html information, they are entering a %26lt;img src="http://picsite/mypic.jpg" align=left%26gt; with it...



the http part is the url to an uploaded picture...



Picture with text around it?

To put multiple lines of text next to a picture, you need to use tables...



For example, to create a 2-column table, with one line, and have a picture in the left-cell, and text in the right-cell, with a 2-pixel gap between them:



%26lt;table border="0" cellpadding="0" cellspacing="2"%26gt;



%26lt;tr%26gt;%26lt;td%26gt;%26lt;img src="myimage.jpg"%26gt;%26lt;/td%26gt;



%26lt;td%26gt;This is my text, which can be on multiple lines...%26lt;/td%26gt;%26lt;/tr%26gt;%26lt;/table%26gt;

No comments:

Post a Comment

 
web development