float img with text flush left |
float img with text flush left |
pfortier |
Mar 2 2012, 01:02 PM
Post
#1
|
Group: Members Posts: 2 Joined: 2-March 12 Member No.: 16,619 |
I wanted several rows of the following: image to the left of text that displays on the right of the image and under when beyond image (i.e text floats around image).
I tried: <table> <tr><td><img valign=top align=left src=img.png>My text</td></tr> <tr><td><img valign=top align=left src=img.png>My text</td></tr> </table> This code displays properly but printing from chrome and IExplorer is rendered badly where rows overlap (i.e. image and text sometimes overlap). However, older versions of IExplorer (version 6) renders this properly. So I tried instead. <p><img valign=top align=left src=img.png>My text</p> <p><img valign=top align=left src=img.png>My text</p> This code prints exactly what has been displayed but the problem is that the next image is not flush left on the page when the text to the right of the previous image was not long enough to continue below the image. In this case the next image starts to the right of the previous image. I've tried many options but found no solution yet. |
Darin McGrew |
Mar 2 2012, 05:37 PM
Post
#2
|
WDG Member Group: Root Admin Posts: 8,365 Joined: 4-August 06 From: Mountain View, CA Member No.: 3 |
It sounds like you need to clear the float in the second example. Please see the FAQ entry How do I align an image to the right (or left)?
|
pfortier |
Apr 6 2012, 09:46 AM
Post
#3
|
Group: Members Posts: 2 Joined: 2-March 12 Member No.: 16,619 |
It sounds like you need to clear the float in the second example. Please see the FAQ entry How do I align an image to the right (or left)? Thanks. The problem was solved by the following: <p style='float:left;'><img valign=top align=left src=img.png>My text</p> |
Lo-Fi Version | Time is now: 25th April 2024 - 06:51 AM |