guys...can you help me out here? see this background image of the beach? i need to stretch that out all the way... http://shoutoutsarcasm.com/test/skyler11/index2.html (i built this out in tables with a background image) the background image should look like this... http://shoutoutsarcasm.com/test/skyler11/index.html (someone else built this out in css with the background image) his background works.... but mine is cleaner... how can i use mine and stretch that background image?
the html/css code to stretch a background image i can do...simply by this code alone... <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <title>Stretched Background Image</title> <style type="text/css"> /* Remove margins from the 'html' and 'body' tags, and ensure the page takes up full screen height */ html, body {height:100%; margin:0; padding:0;} /* Set the position and dimensions of the background image. */ #page-background {position:fixed; top:0; left:0; width:100%; height:100%;} /* Specify the position and layering for the content that needs to appear in front of the background image. Must have a higher z-index value than the background image. Also add some padding to compensate for removing the margin from the 'html' and 'body' tags. */ #content {position:relative; z-index:1; padding:10px;} </style> <!-- The above code doesn't work in Internet Explorer 6. To address this, we use a conditional comment to specify an alternative style sheet for IE 6 --> <!--[if IE 6]> <style type="text/css"> html {overflow-y:hidden;} body {overflow-y:auto;} #page-background {position:absolute; z-index:-1;} #content {position:static;padding:10px;} </style> <![endif]--> </head> <body> <div id="page-background"><img src="http://www.quackit.com/pix/milford_sound/milford_sound.jpg" width="100%" height="100%" alt="Smile"></div> <div id="content"> <h2>Stretch that Background Image!</h2> <p>This text appears in front of the background image. This is because we've used CSS to layer the content in front of the background image. The background image will stretch to fit your browser window. You can see the image grow and shrink as you resize your browser.</p> <p>Go on, try it - resize your browser!</p> </div> </body> </html> ....however, i need to place a table above it... <table width="1010" border="0" align="center" cellpadding="0" cellspacing="0"> <tr> <td><img src="images2/spacer.gif" width="1" height="10" /></td> </tr> <tr> <td align="center"><img src="images2/logo.png" width="446" height="101" /></td> </tr> <tr> <td><table width="446" border="0" align="center" cellpadding="0" cellspacing="0"> <tr> <td width="185"><img src="images2/love.png" width="185" height="36" /></td> <td width="60"><a href="#"><img src="images2/like.png" width="60" height="36" border="0" /></a></td> <td width="201"><a href="#"><img src="images2/rumor.png" width="201" height="36" border="0" /></a></td> </tr> </table></td> </tr> <tr> <td><table width="100%" border="0" cellspacing="15" cellpadding="15"> <tr> <td align="center"><iframe src="http://player.vimeo.com/video/19590568?title=0&byline=0&portrait=0&color=4a4747&autoplay=1" width="585" height="338" frameborder="0"></iframe></td> </tr> </table></td> </tr> <tr> <td><table width="446" border="0" align="center" cellpadding="0" cellspacing="0"> <tr> <td width="110"><a href="#"><img src="images2/socialicon1.png" width="110" height="71" border="0" /></a></td> <td width="75"><a href="#"><img src="images2/socialicon2.png" width="75" height="71" border="0" /></a></td> <td width="91"><a href="#"><img src="images2/socialicon3.png" width="91" height="71" border="0" /></a></td> <td width="86"><a href="#"><img src="images2/socialicon4.png" width="86" height="71" border="0" /></a></td> <td width="86"><a href="#"><img src="images2/socialicon5.png" width="86" height="71" border="0" /></a></td> </tr> </table></td> </tr> <tr> <td><img src="images2/spacer.gif" width="1" height="200" /></td> </tr> </table> any ideas?
ok i've got it to this point but now i've gotta position that table http://shoutoutsarcasm.com/test/skyler11/index5.html