PDA

View Full Version : Getting Divs To Move With Screen Size


oni3350
03-14-2009, 04:05 AM
Hey i found some code to make the screen automaticly centre with screen size, this is it here:

<head>
</style>
<style> div.wrapper {
margin-left: 10%;
margin-right: 10%;
}
/* width of div.wrapper is always 80% of viewport width */ </style>
</head>

<div class="wrapper"> BODY AND CONTENT HERE</div>

But i don't think this code is working...... Is this a correct code that works or not?

Thank You

Ricky55
03-14-2009, 05:02 AM
Its correct. You've just typed it with a mistake

it should be


<!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>Enter a title</title>
<style type="text/css">
.wrapper {
margin-left: 10%;
margin-right: 10%;
background: red;
}
</style>



</head>

<body>
<div class="wrapper">BODY AND CONTENT HERE</div>
</body>
</html

oni3350
03-14-2009, 05:53 AM
I tried sending this via PM but it was too big, Yes this is code for a adult site i am making. I got warned last time i uploaded code in here. BUT there should be no links in this code so hopefully it will be ok :)




ok i hope you will be able to follow this, i know the way i have constructed it is all over the place (i think) im still new to dreamweaver. But that code you gave me just then, i couldnt figure out where to put it inside the body tag because it starts off like this ::::

<body bgcolor="#FFFFFF" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0" onLoad="MM_preloadImages('images/MainRO.jpg','images/CategoryRO.jpg','images/Live-CamsRO.jpg','images/Find-A-****RO.jpg','images/SexToysRO.jpg','images/Free-StuffRO.jpg','images/SexGamesRO.jpg','images/PSPIPODRO.jpg')">


So i put the <div class="wrapper"> below that, but im not sure if it worked :(

CODE::::::

<html>
<head>
<title>The Exclusive XXX Offers, Exclusive Zone! Full Of Freebies And Free Offers!</title>
<style type="text/css">
.wrapper {
margin-left: 10%;
margin-right: 10%;
background: red;
}
</style>

<meta name="description" content="This is the Exclusive XXX Offers Exclusive Zone, where you can view free porn galleries of picture and movies, get free stuff, find a local girl to ****,watch live cams,upload your porn to ipod and psp plus loads more!" />
<meta name="keywords" content="cheap porn cheap porn dvds cheap gay porn free porn hardcore exclusive xxx offers cheap high quality porn paysites">
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script type="text/javascript">
<!--
function MM_swapImgRestore() { //v3.0
var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
}
function MM_preloadImages() { //v3.0
var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}

function MM_findObj(n, d) { //v4.01
var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
if(!x && d.getElementById) x=d.getElementById(n); return x;
}

function MM_swapImage() { //v3.0
var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
}
//-->
</script>
<style type="text/css">
<!--
body {
background-image: url(stripe_45f8cb3599938272753a09937f5b8da8.png);
}
#apDiv18 {
position:absolute;
left:50px;
top:632px;
width:878px;
height:320px;
z-index:34;
}
#apDiv19 {
position:absolute;
left:259px;
top:865px;
width:224px;
height:206px;
z-index:35;
}
#apDiv31 {
position:absolute;
left:256px;
top:863px;
width:233px;
height:203px;
z-index:34;
}
#apDiv30 {
position:absolute;
left:255px;
top:1223px;
width:237px;
height:203px;
z-index:35;
}
#apDiv32 {
position:absolute;
left:255px;
top:1594px;
width:242px;
height:233px;
z-index:36;
}
#apDiv33 {
position:absolute;
left:254px;
top:1959px;
width:230px;
height:219px;
z-index:37;
}
-->
</style></head>

<body bgcolor="#FFFFFF" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0" onLoad="MM_preloadImages('images/MainRO.jpg','images/CategoryRO.jpg','images/Live-CamsRO.jpg','images/Find-A-****RO.jpg','images/SexToysRO.jpg','images/Free-StuffRO.jpg','images/SexGamesRO.jpg','images/PSPIPODRO.jpg')">
<div class="wrapper">
<div id="apDiv1" style="position: absolute; left: 48px; top: 0px; width: 351px; height: 104px; z-index: 1; vertical-align: middle"><img src="images/Exclusive-Zone-Naked-Lesbians.jpg" width="351" height="104" alt=""></div>
<div id="apDiv2" style="position: absolute; left: 399px; top: 0px; width: 315px; height: 104px; z-index: 2; vertical-align: middle"><img src="images/Exclusive-Zone-lesbians.jpg" width="315" height="104" alt=""></div>
<div id="apDiv3" style="position: absolute; left: 714px; top: 0px; width: 234px; height: 103px; z-index: 3"><img src="images/Exclusive-Zone-blue-dildo.jpg" width="234" height="103" alt=""></div>
<div id="apDiv4" style="position: absolute; left: 714px; top: 103px; width: 234px; height: 274px; z-index: 4; vertical-align: middle"><img src="images/Exclusive-Zone-naked-girl-with-big-boobs.jpg" width="234" height="274" alt=""></div>
<div id="apDiv5" style="position: absolute; left: 48px; top: 104px; width: 351px; height: 273px; z-index: 5"><img src="images/Exclusive-Zone-lesbians-free.jpg" width="351" height="273" alt=""></div>
<div id="apDiv6" style="position: absolute; left: 399px; top: 104px; width: 315px; height: 273px; z-index: 6"><img src="images/Exclusive-Zone-free-porn.jpg" width="315" height="273" alt=""></div>
<div id="apDiv7" style="position: absolute; left: 48px; top: 377px; width: 351px; height: 196px; z-index: 7"><img src="images/NewHeading-Page-CATEGORIES_07.jpg" width="351" height="196" alt=""></div>
<div id="apDiv8" style="position: absolute; left: 399px; top: 377px; width: 315px; height: 196px; z-index: 8"><img src="images/NewHeading-Page-CATEGORIES_08.jpg" width="315" height="196" alt=""></div>
<div id="apDiv9" style="position: absolute; left: 714px; top: 377px; width: 234px; height: 196px; z-index: 9"><img src="images/NewHeading-Page-CATEGORIES_09.jpg" width="234" height="196" alt=""></div>
<div id="apDiv10" style="position: absolute; left: 48px; top: 573px; width: 103px; height: 59px; z-index: 10"><a href="" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Main','','images/MainRO.jpg',1)"><img src="images/Main.jpg" alt="porn review" name="Main" width="103" height="59" border="0"></a></div>
<div id="apDiv11" style="position: absolute; left: 151px; top: 573px; width: 111px; height: 59px; z-index: 11"><a href="ExclusiveZone.html" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Catagories','','images/CategoryRO.jpg',1)"><img src="images/Category.jpg" alt="porn review" name="Catagories" width="111" height="59" border="0"></a></div>
<div id="apDiv12" style="position: absolute; left: 262px; top: 573px; width: 109px; height: 59px; z-index: 12"><a href="Livecams/livecams.html" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Live Cams','','images/Live-CamsRO.jpg',1)"><img src="images/Live-Cams.jpg" alt="porn review" name="Live Cams" width="109" height="59" border="0"></a></div>
<div id="apDiv13" style="position: absolute; left: 371px; top: 573px; width: 108px; height: 59px; z-index: 13"><a href="Finda****/finda****.html" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Find A ****','','images/Find-A-****RO.jpg',1)"><img src="images/Find-A-****.jpg" alt="porn review" name="Find A ****" width="108" height="59" border="0"></a></div>
<div id="apDiv14" style="position: absolute; left: 479px; top: 573px; width: 106px; height: 59px; z-index: 14"><a href="Sextoys/sextoys.html" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Sex Toys','','images/SexToysRO.jpg',1)"><img src="images/SexToys.jpg" alt="porn review" name="Sex Toys" width="106" height="59" border="0"></a></div>
<div id="apDiv15" style="position: absolute; left: 585px; top: 573px; width: 105px; height: 59px; z-index: 15"><a href="freestuff/freestuff.html" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Free Stuff','','images/Free-StuffRO.jpg',1)"><img src="images/Free-Stuff-.jpg" alt="porn review" name="Free Stuff" width="105" height="59" border="0"></a></div>
<div id="apDiv16" style="position: absolute; left: 690px; top: 573px; width: 111px; height: 59px; z-index: 16"><a href="Sexgames/sexgames.html" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Sex Games','','images/SexGamesRO.jpg',1)"><img src="images/SexGames.jpg" alt="porn review" name="Sex Games" width="111" height="59" border="0"></a></div>
<div id="apDiv17" style="position: absolute; left: 801px; top: 573px; width: 147px; height: 59px; z-index: 17"><a href="Ipodorpspuploads/ipodorpspuploads.html" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Upload To PSP Or IPOD','','images/PSPIPODRO.jpg',1)"><img src="images/PSPIPOD.jpg" alt="porn review" name="Upload To PSP Or IPOD" width="147" height="59" border="0"></a></div>
<div id="apDiv20" style="position: absolute; left: 48px; top: 632px; width: 469px; height: 194px; z-index: 1"><img src="images/Catarogy-black-left.jpg" width="469" height="194"></div>
<div id="apDiv21" style="position: absolute; left: 517px; top: 632px; width: 431px; height: 194px; z-index: 2"><img src="images/catagory-black-right.jpg" width="431" height="194"></div>
<div id="apDiv22" style="position: absolute; left: 48px; top: 826px; width: 469px; height: 324px; z-index: 3"><img src="images/left1.gif" width="469" height="324" alt=""></div>
<div id="apDiv23" style="position: absolute; left: 517px; top: 826px; width: 431px; height: 324px; z-index: 4"><img src="images/right1.gif" width="431" height="324" alt=""></div>
<div id="apDiv24" style="position: absolute; left: 48px; top: 1150px; width: 469px; height: 379px; z-index: 5"><img src="images/left2.gif" width="469" height="379" alt=""></div>
<div id="apDiv25" style="position: absolute; left: 517px; top: 1150px; width: 431px; height: 379px; z-index: 6"><img src="images/right2.gif" width="431" height="379" alt=""></div>
<div id="apDiv26" style="position: absolute; left: 49px; top: 1529px; width: 468px; height: 353px; z-index: 7"><img src="images/left3.gif" width="468" height="353" alt=""></div>
<div id="apDiv27" style="position: absolute; left: 517px; top: 1529px; width: 431px; height: 353px; z-index: 8"><img src="images/right3.gif" width="431" height="353" alt=""></div>
<div id="apDiv28" style="position: absolute; left: 49px; top: 1882px; width: 468px; height: 433px; z-index: 9"><img src="images/left4.gif" width="468" height="433" alt=""></div>
<div id="apDiv29" style="position: absolute; left: 517px; top: 1882px; width: 431px; height: 433px; z-index: 10"><img src="images/right4.gif" width="431" height="433" alt=""></div>
<div id="apDiv31"><a href="Sites/round and brown.html"><img src="images/roundandbrown.jpg" alt="round and brown" width="225" height="205" border="0"></a></div>
<div id="apDiv30"><a href="Sites/lifetime black pass.html"><img src="images/lifetimeblackpass.jpg" alt="lifetime black pass" width="225" height="205" border="0"></a></div>
<div id="apDiv32"><a href="Sites/we **** blacks.html"><img src="images/we****blacks.jpg" alt="we **** blacks" width="225" height="205" border="0"></a></div>
<div id="apDiv33"><a href="Sites/bare black.html"><img src="images/bareblacks.jpg" alt="bare black" width="225" height="205" border="0"></a></div>
<script type="text/javascript">
var gaJsHost = (("https:" == document.location.protocol) ? "https://ssl (https://ssl/)." : "http://www (http://www/).");
document.write(unescape("%3Cscript src='" + gaJsHost + "google-analytics.com/ga.js (http://google-analytics.com/ga.js)' type='text/javascript'%3E%3C/script%3E"));
</script>
<script type="text/javascript">
try {
var pageTracker = _gat._getTracker("UA-6414141-2");
pageTracker._trackPageview();
} catch(err) {}</script>
</div>
</body>
</html>