Sorry about that. Hope it makes more sense now:
<html>
<head>
<style>
#block-12 .blockinner {
background-color: #F2F2F0;
margin:0 auto;
border: 1px solid red;
}
#block-12 .blockinner .top {
height:50px;
width:100%;
}
#block-12 .blockinner .border {
margin:-44px 0 0;
padding:1px 6px;
position:relative;
}
#block-12 .blockinner .bottom {
height:7px;
width:100%;
}
</style>
</head>
<body>
<div id="block-12">
<div class="blockinner">
<div class="top"> </div>
<div class="border">
<h2 class="title">This is a title.... which I dont really care about
....</h2>
<div class="content">
<p><a
href="http://www.google.com";><img<http://www.google.com%22%3e%3cimg/>hspace="5"
height="121" align="left" width="256" vspace="5"
title="slkdfjsdlkfjdlskfjdlkfj" alt="dslfk ldsfj dlskfj dlkfj "
src="sdfsdfdf.jpg"></a>I dont really care about this text either.... I just
wish that the red border would include the image on the left, and be wrapped
around it nicelly, as opposed to half way down the image...</p>
</div>
</div>
<div class="bottom"> </div>
</div>
</div>
</body>
</html>
On Thu, Sep 30, 2010 at 3:40 PM, Chris Blake <[email protected]> wrote:
> Hi,
>
> I copied the code into my editor and redered it. It's abit hard to see what
> you're trying to do. Can you explain a bit more.. is it for a header? Could
> you replace the dummy content with somethig a bit more meaningful because
> the text over the image, and text next to it is that same so it's just a bit
> of a mess. It also seems like you have a lot of wrappers happening which
> might not be needed.
>
> Cheers, CB
>
>
>
> On 30/09/2010, at 10:17 AM, Anthony wrote:
>
> Hi all
>>
>> I have been trying to figure out how to wrap the background around the
>> image on the left, so that the image doesn’t stick out outside the
>> background. But I haven’t had any luck. Any help would be greatly
>> appreciated.
>>
>> <html>
>> <head>
>> <style>
>> #block-12 .blockinner {
>> background-color: #F2F2F0;
>> margin:0 auto;
>> }
>> #block-12 .blockinner .top {
>> height:50px;
>> width:100%;
>> }
>> #block-12 .blockinner .border {
>> margin:-44px 0 0;
>> padding:1px 6px;
>> position:relative;
>> }
>> #block-12 .blockinner .bottom {
>> height:7px;
>> width:100%;
>> }
>> </style>
>> </head>
>> <body>
>> <div id="block-12">
>> <div class="blockinner">
>> <div class="top"> </div>
>> <div class="border">
>> <h2 class="title">slkdfj aldskfjsd lakfjlsdkfj sldkfj sldkfj </h2>
>> <div class="content">
>> <p><a href="http://www.google.com";><img hspace="5"
>> height="121" align="left" width="256" vspace="5"
>> title="slkdfjsdlkfjdlskfjdlkfj" alt="dslfk ldsfj dlskfj dlkfj "
>> src="sdfsdfdf.jpg"></a>lsdf alsdkf jsldkfj lsdkfj slkdfj sdlkfj sldkfj
>> lsdkjf lsdkjf lsdk fjldks fjldkf jdlkfj dlkfj dlkfj dlk f</p>
>> </div>
>> </div>
>> <div class="bottom"> </div>
>> </div>
>> </div>
>> </body>
>> </html>
>>
>> A
>> ______________________________________________________________________
>> css-discuss [[email protected]]
>> http://www.css-discuss.org/mailman/listinfo/css-d
>> List wiki/FAQ -- http://css-discuss.incutio.com/
>> List policies -- http://css-discuss.org/policies.html
>> Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
>>
>>
>
______________________________________________________________________
css-discuss [[email protected]]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
