Skarabeol Posted June 9, 2011 Share Posted June 9, 2011 This is the page <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <!-- Please keep the author:) Template made by WickedHacker --> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta name="keywords" content="" /> <meta name="description" content="" /> <meta http-equiv="content-type" content="text/html; charset=utf-8" /> <title>My f****** Page</title> <link href="style.css" rel="stylesheet" type="text/css" media="screen" /> </head> <body> <div id="header"></div> <div id="navigation"> <div id="nav-menu"> <ul> <li><a href="/home"><span>Home</span></a></li> <li><a href="#"><span>Forum</span></a></li> <li><a href="#"><span>Updates</span></a></li> </ul> </div> </div> <div id="aspect-top"></div> <div id="aspect-content"> <div id="content"> aaa<br />aaa<br />aaa<br />aaa<br />aaa<br />aaa<br />aaa<br /> </div> </div> </body> </html> This si the part of css where i need help #aspect-content { position:absolute; top:505px; left:200px; width: 900px; background: url(page.png) repeat-y left top; } #content { position:relative; top:30px; left:30px; width: 810px; } When i put someting in <div id="content"> the <div id="aspect-content">`s widht don`t grow up once with <div id="content"> Here is an image:) http://imageshack.us/photo/my-images/807/unled4fp.png/ Quote Link to comment Share on other sites More sharing options...
cssfreakie Posted June 9, 2011 Share Posted June 9, 2011 That's because you gave it a property of absolute. If you read the manual it will say that by assigning an element with the property of absolute it will be taken out of the normal flow. The consequence of that is that the dimensions of the absolute positioned element will not affect anything else. So if you would just assign it with a position of relative you will probably see the impact. Although i must say that there is no reason at all for this design to add a position of relative nor absolute as far as i can tell from the picture. I recommend to have a read on the css boxmodel. A pretty vital concept in css if your designing. http://bayarearcsociety.com/tutorial/css_tutorial14.php Btw that is a link to a pretty good to follow css tutorial. it wont beat a book, but for learning the basics it's good enough. Quote Link to comment Share on other sites More sharing options...
Skarabeol Posted June 10, 2011 Author Share Posted June 10, 2011 thank you so much:) Quote Link to comment Share on other sites More sharing options...
cssfreakie Posted June 10, 2011 Share Posted June 10, 2011 thank you so much:) Don't forget to mark it solved, saves other time reading through Quote Link to comment Share on other sites More sharing options...
Skarabeol Posted June 13, 2011 Author Share Posted June 13, 2011 I have another problem now:) <div id="aspect-top"> <div class="title"><h1>My title Here!</h1></div> <div class="title_author">Wicked hacker</div> </div> #aspect-top { position:absolute; top:230px; left:200px; width: 900px; height: 60px; background: url(page_top2.png) no-repeat left top; z-index:-1; } .title { margin:20px auto; width: 860px; color:#752626 } .title h1{ line-height:2em; color:#752626; text-align:center; } .title_author { position:relative; right:25px; top:20px; color:#ff0000; } Image i think i should use z-index but it doesn`t work:) Quote Link to comment Share on other sites More sharing options...
Skarabeol Posted June 13, 2011 Author Share Posted June 13, 2011 i solved it:) Quote Link to comment Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.