On Fri, 1 Oct 2004 07:58:51 -0700, Robin Button wrote:
> How can one have an image on the left with a caption below the image, and
> text on the right. I don't want to text to float around the image and I
> don't want to use a table.
so you want:
xxxxxxx lorem epsum lorem epsum lorem epsum lorem epsum
xxxxxxx lorem epsum lorem epsum lorem epsum lorem epsum
xxxxxxx lorem epsum lorem epsum lorem epsum lorem epsum
lorem epsum lorem epsum lorem epsum lorem epsum
caption lorem epsum lorem epsum lorem epsum lorem epsum
lorem epsum lorem epsum lorem epsum lorem epsum
lorem epsum lorem epsum lorem epsum lorem epsum
lorem epsum lorem epsum lorem epsum lorem epsum
lorem epsum lorem epsum lorem epsum lorem epsum
?
Consider:
<div id="captionedImageBlock">
<div>caption</div>
<p>lorem epsum lorem epsum lorem epsum lorem epsum </p>
</div>
css:
#captionedImageBlock div {
background: url('animage.jpg') no-repeat;
padding-top: Npx;
float: left;
width: Mpx;
}
#captionedImageBlock p {
margin-left: Mpx;
}
where N is the height of the image and M is the width of the image
(plus a little)
You'd also want a little bit of spacing around the image, too.
(Thank you for asking, I had a need for this on a page and the answer
sprang straight into my head when I saw your question :))
warmly,
Lea
--
Lea de Groot
Elysian Systems - http://elysiansystems.com/
Brisbane, Australia
******************************************************
The discussion list for http://webstandardsgroup.org/
Proud presenters of Web Essentials 04 http://we04.com/
Web standards, accessibility, inspiration, knowledge
To be held in Sydney, September 30 and October 1, 2004
See http://webstandardsgroup.org/mail/guidelines.cfm
for some hints on posting to the list & getting help
******************************************************
