Mon, 2004-10-04 21:19
As you can see the text has a big space between it and the menu.
#content
{
background: #FFFFFF;
border: 1px #000000 solid;
border-top: 0px;
position: absolute;
width: 750px;
top: 162px;
padding: 4px;
float: right;
}
#content .menu_left
{
background: #FFFFFF;
height: 200px;
width: 150px;
border: 1px #000000 solid;
position: relative;
top: -15px;
left: -75px;
float: left;
text-align: center;
}
<div id='content'> <div class='menu_left'> <ul> <li><a href='#'>Home</a></li> <li><a href='#'>Products</a></li> <li><a href='#'>About Us</a></li> <li><a href='#'>Contact</a></li> </ul> </div> <p>Lorem ipsum dolor ... nulla.</p> </div>
How can I make the text flow around the menu?
Tue, 2004-10-05 04:54
#1
Help with CSS positioning
it looks fine to me (mozilla firefox 1.0pr & ms ie).. which big space are you referring??
Tue, 2004-10-05 07:14
#2
Help with CSS positioning
spl1nter, the text is flowing around the menu; but I'm afraid that you seem confused about how to use positioning, you have floats with absolute positioning if you were to remove the positionings and negative margins/co-ordinates you would see the menu take up correct position top left corner then with use of margins on the menu you could control the spacing betwen text and menu box. you have floated the main container it would probably be better as static or relative with a further div holding your text then play around with off-setting the menu and also you have declared the rules twice in the stylesheet?
These links may be of help,
http://www.positioniseverything.net/articles/flow-pos.html
http://css.maxdesign.com.au/floatutorial/
Hugo.