Posted by Jonathan N. Little on 06/02/06 03:12

dorayme wrote:
> In article <97119$447f8ece$40cba7cf$9169@NAXS.COM>,
> "Jonathan N. Little" <lws4art@centralva.net> wrote:
>
>> CSS:
>>
>> .pixbox { overflow: auto; }
>> .pixbox IMG { display: block; float: left; margin-right: 1em; }
>>
>>
>> HTML:
>>
>> <div>
>> <img src="yourpix.jpg" alt="the pix">
>> write stuff about your picture here...
>> </div>
>> ...
>
> With some assumptions about referencing your classes in the html
> (not in your snippet), the text wraps under the pic, is this what
> is wanted? And the 1em had no effect in Safari?
>
> What I had in mind in previous post was more like:
>
> .pic {float:left;width:500px}
> .picText {margin-left: 510px;}
>
> <img class="pic" src="pics/northCoastCountryScene.jpg" alt="the
> pix">
> <div class="picText">write stuff about your picture here...</div>
>

Nope, should have been:

<div class="pixbox">
<img src="yourpix.jpg" alt="the pix">
write stuff about your picture here...
</div>


then later if your decided to put picture on right and text on left then
only changing the CSS

..pixbox { overflow: auto; }
..pixbox IMG { display: block; float: right; margin-left: 1em; }

or to put the text under

..pixbox { overflow: auto; }
..pixbox IMG { display: block; margin-bottom: .5em; }

--
Take care,

Jonathan
-------------------
LITTLE WORKS STUDIO
http://www.LittleWorksStudio.com

• Next in forum: Re: center/shrink to fit redux.
• Prev in forum: Database XML feed question?
• Thread view: Re: How to do this TD trick with CSS

[Reply to this message]