June 25, 200818 yr Hi there lads, I am hoping that someone can help me solve my problem with my website: www.scandinavian-id.com Notice when you manually adjusts the size of your webbrowser very small, how alle the links, text and the logo moves around on the page and gets pressed together, I want to lock it's position within the 600x800px background I've made. First thing I did was to make a new HTML in Dreamweaver and then make a 3x1 table, the center table is the one with the red-ish background and where I want the content of my website to be in. I've tried using the #wrapper and <div id="wrapper"> commands but I cant get them to work, obviously since my website is a bloody mess. Below I've posted the entire code of my index site. And please take a look at www.scandinavian-id.com and adjust the browser size. HTML CODE, copied from Dreamweaver!!!!!!!!!!!!!!!!!!!!! <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>index</title> <style type="text/css"> <!-- body { background-image: url(main-bg.jpg); background-repeat: repeat; background-attachment: fixed; text-align: justify; } .test { background-image: url(test-bg.jpg); background-repeat: no-repeat; float: none; height: 800px; width: 600px; background-attachment: scroll; background-position: center center; border-top-width: thin; border-right-width: thin; border-bottom-width: thin; border-left-width: thin; border-top-style: none; border-right-style: none; border-bottom-style: none; border-left-style: none; border-top-color: #333333; border-right-color: #00FF00; border-bottom-color: #00FF00; border-left-color: #00FF00; position: static; margin: 0px; padding: 0px; page-break-before: auto; page-break-after: auto; font-family: "Century Gothic"; text-align: left; vertical-align: baseline; white-space: normal; #wrapper { margin: 0 auto; width: 600px; } .side { clear: none; float: none; height: auto; width: auto; background-position: left top; } --> </style> </head> <body> <table width="100%" border="0" cellspacing="0" cellpadding="0" style="height:100%"> <tr> <div id="wrapper"> <td align="center"> <div id="wrapper> <td width="0%" class="side"> </td> <td width="100%" class="test"><table width="100%" border="0"> <tr> <td><td align="center"><div align="center"><img src="logo.png" width="400" height="80" /></div></td> </tr> </table> <table width="100%" border="0"> <tr> <td width="15%"><a href="test2.html">LINK</a></td> <td width="13%"><a href="test3.html">LINK2</a></td> <td width="12%"><a href="test4.html">LINK3</a></td> <td width="11%">LINK4</td> <td width="12%">LINK5</td> <td width="12%">LINK6</td> <td width="13%">LINK7</td> <td width="12%">LINK8</td> </tr> </table> <p>THIS SITE IS UNDER CONSTRUCTION! THIS SITE IS UNDER CONSTRUCTION!</p> <p> </p> <p>MONSALDJSA DSADJ SAKDJ LASDJ LSA DLSA DLKSA DLKSA DLSA DLKSA DLKSA DLK SADL SADLJ SAD L SADLKJ ASLDKJA SLKDJ SAKDJ KD J</p></td> <td width="0%" class="side"> </td> </tr> </div> </table> </body> </html> Hope someone can help me :]
Create an account or sign in to comment