Hi,
Or another solution would be to put a div around everything you want to the
right of the float left image and put it in a float left div with a width.
(Obviously not with css inline like I've done it tho)
<img style="float:left">
<div style="float:left;width:300px;">
<h4>Stuff here</h4>
<ul><li>Here's my list</li></ul>
</div>
(If you want to see it in example... I've done that here with pictures on left
and the text to the right http://www.quizzle.co.uk/quizzle_guide_to_london.asp )
~ Lacuna
-----Original Message-----
From: [EMAIL PROTECTED] [mailto:[EMAIL PROTECTED] On Behalf Of Gunlaug Sørtun
Sent: 08 August 2007 03:03
To: Amy Drayer
Cc: [email protected]
Subject: Re: [css-d] simple stop wrapping
Amy Drayer wrote:
> I have an image floating to the left and an h4 and p/ul I want sitting next
> to it. Right now it's wrapping under the image if the paragraph or list is
> longer than the image.
>
> http://new.jocolibrary.org/research (need it quick box)
Add...
#needitquick div img {margin-bottom: 2em; display: inline;}
#needitquick div form img {margin-bottom: .5em;}
#needitquick div h4 {overflow: hidden; margin: 0;}
* html #needitquick div h4 {overflow: visible; height: 100%;}
#needitquick div p {overflow: hidden;}
* html #needitquick div p {overflow: visible; height: 100%;}
...which will introduce 'block formatting' in standard-aware browsers,
and add a 'hasLayout' trigger for old IE6. The result is self-adjusting
line-up with no wrapping under the image.
The 2em margin bottom on images will secure the effect even when
subjected to a reasonable amount of font resizing.
> And what's up with ul/li wrapping weird in the "More research tools" in IE
> at:
> http://new.jocolibrary.org/default.aspx?id=2150
IE's reaction to...
#moretools li {
list-style-position:inside;
}
Delete that style and IE will render ok.
regards
Georg
--
http://www.gunlaug.no
______________________________________________________________________
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
______________________________________________________________________
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
