Sent by saul on 18 January 2005 21:09
Thank you Holly (and to everyone else).
The code changes suggested below made the image appear.
Thanks again,
Saul
>--- Original Message ---
>From: "Holly Bergevin" [EMAIL-REMOVED]>
>To: [EMAIL-REMOVED]>, "saul" [EMAIL-REMOVED]>
>Date: 1/18/05 3:36:44 PM
>
From: "saul" [EMAIL-REMOVED]>
>
>>I'm trying to place an image and a caption within the flow
of
>>paragraph
>
>>http://www.inventionshow.com/17_inv_community/200303/index01.shtml
>
>[snip]
>
>>I [snip] cannot get the image
>>to do what I would like it to do. Any suggestions?
>
>You've run into an IE bug, related to the peekaboo bug [1].
Alter your CSS (embedded) to the following -
>
>div.figure {
>float: left;
>border: 1px black solid;
>margin: 0 0.5em 0.5em 0; /* shorthand margin property */
>position: relative; /* this is what fixes IE */
>width: 55px; /* set div width to image width */
>}
>div.figure p {
>text-align: left;
>font-style: bold;
>font-size: 10px;
>font-family: Verdana, "Tahoma", Arial, sans-serif;
>margin: 3px; /*specifically set this */
>}
>
>If you'd prefer white space within the div to surround the image,
add some padding {padding: 3px;) to the div and remove the {display:
block;} from the div.figure img selector.
>
>The CSS would look like the following -
>
>div.figure {
>float: left;
>border: 1px black solid;
>margin: 0 0.5em 0.5em 0;
>position: relative;
>width: 55px;
>text-align: center; /* centers the image */
>padding: 3px; /* provides the space */
>}
>div.figure p {
>text-align: left;
>font-style: bold;
>font-size: 10px;
>font-family: Verdana, "Tahoma", Arial, sans-serif;
>margin: 3px;
>}
>div.figure img { /* display: block; is removed */
>margin: 0;
>padding: 0;
>
>>The rest of the CSS works fine, and is in a separate document,
>
>Well, I don't know about your statement that the rest of the
CSS "is in a separate document." There's a heck of a lot of inline
CSS on that page; all the inline styles for the menu for one
thing. You also have some align attributes that could probably
be moved to the style sheet.
>
>I hope these suggestions work as you want. If not, let us know
what's still not working.
>
>~holly
>
>[1]http://www.positioniseverything.net/articles/hollyhack.html
- See {position: relative;} on this page.
>
>
>______________________________________________________________________
>css-discuss [EMAIL-REMOVED]]
>http://www.css-discuss.org/mailman/listinfo/css-d
>List wiki/FAQ -- http://css-discuss.incutio.com/
>Supported by evolt.org -- http://www.evolt.org/help_support_evolt
______________________________________________________________________
css-discuss [EMAIL-REMOVED]]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
