D Doomer Diamond Member Dec 5, 1999 3,721 0 0 Apr 10, 2008 #1 Is there any way to make a backround pic dynamically stretch to fit the screen horizonally depending on the screen resolution? I'm using Dreamweaver. TIA
Is there any way to make a backround pic dynamically stretch to fit the screen horizonally depending on the screen resolution? I'm using Dreamweaver. TIA
Snapster Diamond Member Oct 14, 2001 3,916 0 0 Apr 10, 2008 #2 You kind of have to cheat but using an image and set that to be 100% width and height, eg: <?xml version="1.0"?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en"> <head> <title>Page</title> <style type="text/css"> html,body{margin:0px;padding:0px;} html{overflow-y:hidden;} body {height:100%;} div#content { position:absolute; top:0; left:0; z-index:1; } img#bgimage { position:absolute; top:0; left:0; height:100%; width:100%; z-index:-1; } </style> </head> <body> <div id="bgcontainer"> <img id="img" src="image.jpg" alt="" height="100%" width="100%" /> </div> <div id="content"> hello </div> </body> </html>
You kind of have to cheat but using an image and set that to be 100% width and height, eg: <?xml version="1.0"?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en"> <head> <title>Page</title> <style type="text/css"> html,body{margin:0px;padding:0px;} html{overflow-y:hidden;} body {height:100%;} div#content { position:absolute; top:0; left:0; z-index:1; } img#bgimage { position:absolute; top:0; left:0; height:100%; width:100%; z-index:-1; } </style> </head> <body> <div id="bgcontainer"> <img id="img" src="image.jpg" alt="" height="100%" width="100%" /> </div> <div id="content"> hello </div> </body> </html>
H Hyperblaze Lifer May 31, 2001 10,027 1 81 Apr 10, 2008 #3 <html> <head> <title> </title> </head> <body> <img src="image.jpg" alt="" height="100%" width="100%" /> </body> </html> Well, for what you want, I do not believe you need any css.
<html> <head> <title> </title> </head> <body> <img src="image.jpg" alt="" height="100%" width="100%" /> </body> </html> Well, for what you want, I do not believe you need any css.
Snapster Diamond Member Oct 14, 2001 3,916 0 0 Apr 10, 2008 #4 Originally posted by: Hyperblaze <html> <head> <title> </title> </head> <body> <img src="image.jpg" alt="" height="100%" width="100%" /> </body> </html> Well, for what you want, I do not believe you need any css. Click to expand... The css is for allowing content as well, as well as getting rid of margin, scrollbar etc.
Originally posted by: Hyperblaze <html> <head> <title> </title> </head> <body> <img src="image.jpg" alt="" height="100%" width="100%" /> </body> </html> Well, for what you want, I do not believe you need any css. Click to expand... The css is for allowing content as well, as well as getting rid of margin, scrollbar etc.