Daney11 Posted May 23, 2009 Share Posted May 23, 2009 Hey guys, Please take a look at the attached image. Im using the below code, and the background.png is the attached image. body { background-image: url(../images/background.png); background-repeat: repeat-x; } #wrapper { width: 1000px; margin: 0 auto 0 auto; } Now the image background works fine, however all the content goes in the dark grey area, and when text overlapses the dark grey area, it goes onto the white area.... I need to know how to create the background so that the dark grey streches with the content, and the white will be below the content... Thanks Link to comment https://forums.phpfreaks.com/topic/159407-css-background/ Share on other sites More sharing options...
jcombs_31 Posted May 23, 2009 Share Posted May 23, 2009 A background image can not stretch, it can only tile. Link to comment https://forums.phpfreaks.com/topic/159407-css-background/#findComment-840855 Share on other sites More sharing options...
Daney11 Posted May 23, 2009 Author Share Posted May 23, 2009 Ok. How would i create the background on my website then? So that the top section of my website will have the white and the 10px of dark grey, then the middle second will have the dark grey, and the bottom part of the website will just be white, and that all the text will go into the dark grey and white underneath? Thanks Link to comment https://forums.phpfreaks.com/topic/159407-css-background/#findComment-840862 Share on other sites More sharing options...
DarkSuperHero Posted May 23, 2009 Share Posted May 23, 2009 3 divs... One aligned to the top, absolutly positioned....would have your top color one with your content no background color one aligned to the bottom, absolutely positioned, have the background be an image with your bottom background color set your body background to the color of your desired middle section.... :-D usually the way i go about this... make your top and bottom divs 100% wide, and tile the background in the x direction only... :-) Link to comment https://forums.phpfreaks.com/topic/159407-css-background/#findComment-840869 Share on other sites More sharing options...
Daney11 Posted May 25, 2009 Author Share Posted May 25, 2009 Could you post a qucik example when you have a spare 5 minutes please. 100% divs dont go to the end of the broswer. i need to add it into body? Link to comment https://forums.phpfreaks.com/topic/159407-css-background/#findComment-841796 Share on other sites More sharing options...
Axeia Posted May 25, 2009 Share Posted May 25, 2009 For a div to have 100% height, it, and all it's parents should be set to 100%, for example: <html> <head> <style type='text/css'> body, html, .stretchy { height: 100%; padding: 0; margin: 0; } .stretchy{ background: lime; } </style> </head> <body> <div class="stretchy"> </div> </body> </html> Should result in a very very green page. Link to comment https://forums.phpfreaks.com/topic/159407-css-background/#findComment-841844 Share on other sites More sharing options...
Recommended Posts
Archived
This topic is now archived and is closed to further replies.