On this note, does anyone know how to dynamically recreate all the other image alignment options currently available through HTML? E.g. absmiddle, text-top etc., or are we stuck with right/left and then margin settings?
-----Original Message----- From: [EMAIL PROTECTED] [mailto:[EMAIL PROTECTED] On Behalf Of tee Sent: Sunday, 3 July 2005 2:07 PM To: wsg@webstandardsgroup.org Subject: Re: [WSG] SV: digest for wsg@webstandardsgroup.org Importance: High > The obvious img{float:left} is not good - client dont want the text to > be displayed under the image. > If all images ware the same size - it would be simple - just add > margin to <p>, but its not like that... :( And i hate creating classes > like that: .img110px .img180px ..... I think this is the better solution than the background image. You don't need to declare image size but the margin or padding and float left or right. For example: .image { float: right; /* or left */ border: 2px solid #d3d3d3; margin-left: 10px; } When image inserts to the <p>, your text will float around image according. Examples from a site I was working: http://clients.lotusseeds.com/dojoprocedures.html (I have the image temporarily inserted in front of h3 ) http://clients.lotusseeds.com/style.html (image is inserted in the <p> tag) If you want different padding/margin, border and float declared but don't want to bother to create different classes in your css files, you can do this: <p> <img src="yourimage.jpg" alt="" width="95" height="151" style="float: left; margin-left: 0.7em; margin-bottom: 0.5em"/> Blah blah blah </p> tee ****************************************************** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list & getting help ****************************************************** ****************************************************** The discussion list for http://webstandardsgroup.org/ See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list & getting help ******************************************************
