[thelist] CSS to draw box with image inside

[Todd Richards]

Hi Stephan -

I removed the set of <div> tags in the middle of the code, and added a <br
clear="all"> at the end, and it might be what you are after.

HTH,

Todd


<div class="blogbody"><h3 class="title">Endlich unterwegs&nbsp;</h3><img
src="C899007769/E20050702135718/Media/DSC_0023_1.jpg" height="250"
width="379" alt="" />Da sind wir also endlich auch zu dritt mit dem Bus
unterwegs. Die warmen sommerlichen Temperaturen erlauben der Kleinen das
"Nacktbaden" im Bus. Sie scheint's zu geniessen.
<br clear="all">
</div>


 

-----Original Message-----
From: thelist-bounces at lists.evolt.org
[mailto:thelist-bounces at lists.evolt.org] On Behalf Of Stefan Schwarzer
Sent: Thursday, July 07, 2005 2:14 AM
To: thelist at lists.evolt.org
Subject: [thelist] CSS to draw box with image inside

Hi,

I have a problem with the CSS. In principal not too difficult, I'd thought.
I just want that some text and an image stays within a box.  
But I don't know why, the photo always "leaves" the (red) box. (see
screenshot attached) Any idea what I do wrong?

Thanks for your input.

Stef



     img {
         float: right;
         margin-left: 10px;
         margin-bottom: 10px;
         padding: 3px;
         border: 2px solid rgb(0, 0, 0);
         display: inline;
     }

     .blogbody {
         font-family: georgia, serif;
         color: #333;
         font-size: 80%;
         font-weight: normal;
           background: #dd9;
           padding: 10px;
           display: block;
           border: 1px solid #f00;
         }


------------------------------------------------------------------------

<div class="blogbody">

<h3 class="title">  Endlich unterwegs&nbsp;</h3> <br /> <div>
   <img src="C899007769/E20050702135718/Media/DSC_0023_1.jpg"  
height="250" width="379" alt="" />  Da sind wir
   also endlich auch zu dritt mit dem Bus unterwegs. Die warmen sommerlichen
   Temperaturen erlauben der Kleinen das "Nacktbaden" im Bus. Sie scheint's
zu
   geniessen.
</div>

</div>