Jensen Posted March 13, 2007 Share Posted March 13, 2007 So now that the CSS is loading (if you saw my other silly question) I've noticed that it looks great in Firefox, but the text isn't wrapping to the defined width and the menu isn't adhering to the min-height in IE. http://adrienne.jensenonline.org/ - is the site. One would think something like that would be simple to fix, but im having troubles. My CSS: body { margin: 0; padding: 0;font: 8pt/16pt georgia; color: #ffffff; text-align: center; background: transparent url(adriennelogo.jpg) no-repeat center top;}#container { margin: 0px auto; padding: 0; width: 700px; border: none; text-align: left;}#content { top: 266px; position: relative; left: 20px; color: #000000; width: 650; padding-bottom: 29px; text-align: justify;}#menu { position: absolute; left:auto; right:auto; top: 200px; margin-left: 500px; width: 170px;min-height: 252px; background-image: url(menuback.jpg); background-repeat: no-repeat; background-position: left top; padding-left: 30px;color: #F7931D;font-weight: bold;}p {max-width: 350px} Link to comment Share on other sites More sharing options...
pulpfiction Posted March 13, 2007 Share Posted March 13, 2007 Its because of the width of #content, reduce it and it should work fine.....#content { top: 266px; position: relative; left: 20px; color: #000000; width: 475px; padding-bottom: 29px; text-align: justify;} Link to comment Share on other sites More sharing options...
jesh Posted March 13, 2007 Share Posted March 13, 2007 Rather than messing around with positioning, you might consider using float.HTML: <body><div id="container"> <div id="menu">....</div> <div id="content">...</div></div></body> CSS: #container { padding-top: 266px; }#menu { float: right; width: 170px; } Link to comment Share on other sites More sharing options...
Jensen Posted March 13, 2007 Author Share Posted March 13, 2007 awesome, thank you - that fixed the issue with the text wrapping. Anyway to fix the menu being cutoff? the min-height? Link to comment Share on other sites More sharing options...
pulpfiction Posted March 13, 2007 Share Posted March 13, 2007 rather than giving min-height, try giving height: 252px; [equal to height of image]......#menu { position: absolute; left:auto; right:auto; top: 200px; margin-left: 500px; width: 170px; height: 252px; background-image: url(menuback.jpg); background-repeat: no-repeat; background-position: left top; padding-left: 30px;color: #F7931D;font-weight: bold;} Link to comment Share on other sites More sharing options...
Jensen Posted March 13, 2007 Author Share Posted March 13, 2007 Well holy smokes it works Thank you so much! It's amazing how little things affect so much! I appreciate the swift replies. Link to comment Share on other sites More sharing options...
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now