div layout Options

[il0vey0ub0i]

i tried to move my second div && it won`t!!

here`s my code && the picture

it`s the second div

CODE

</td></tr></table></td></tr></table></td></tr></table></div>
<style>
BASIC INSTRUCTIONS:
You can delete this section from the code if you don't need it, but it won't affect the looks of your profile in any way.

For every div class (.div1, .div2, etc) you will notice a lot of common properties. To move the layer, use:
** margin-top to move it up and down
** margin-left to  move it left and right

margin-left begins from the center of your page. If you set it to 0px, the top left corner of the div will be located in the center of the profile. If you want the layer in the center of your profile take the width of the div, divide it by 2, and multiply it by -1. (In other words, divide it by 2 and make it a negative number.) For example, your div is 400px wide. Give it a margin-left of -200px and the div layer will sit in the middle of the screen. Now, if you want to move it somewhere else, you will have to experiment with the position.

margin-top should be no less than 150px since anything above that may overlap the MySpace advertisment.

The rest is self explanatory, width for width,  height for height, colors and so on.

Good Luck!
mrk

bbz Overlay Model Generator (beta)
[url=http://bbzspace.com]http://bbzspace.com[/url]
</style>

<style type="text/css">
body {background-color:606060; background-image:url(http://img150.imageshack.us/img150/1230/waitingon28xk0bc.jpg); background-repeat:no-repeat; background-position:bottom right; background-attachment:fixed;}
td, .text, div, input {color:000000!important;}
span, b {color:8CD8FF!important;}


a:active, a:visited, a:link { font-family:ARIAL; color:F3FF8C;}
a:hover { font-family:ARIAL; color:8CD8FF; text-decoration:none;border-bottom:1px dashed WHITE;}  a.navbar:active, a.navbar:visited, a.navbar:link { font-family:ARIAL; color:F3FF8C;}
a.navbar:hover { font-family:ARIAL; color:8CD8FF; text-decoration:none;border-bottom:1px dashed WHITE;}

table, tr, td, tbody {background-color:transparent; border:0px;}
object {display:block; position:absolute; top:0px; left:0px; visibility:visible;}
table div div, table tr td div font a {visibility:hidden;}
.div1 a, .div2 a, .div3 a, .div4 a {visibility:visible !important;}
.text, table table table table a,
table table table table div,.frm1 {visibility:hidden;}
table table table table div a, .frm1 input {visibility:visible;}
.text, td.text td.text table, .contactTable, .lightbluetext8 {display:none;}
table table, table table td {padding:0px; height:0px;}

.div1 {
background-color:606060; color:8CD8FF;
border:2px solid; border-color:8CD8FF;
width:554px; height:235px; overflow:auto;
position:absolute; z-index:2; left:50%; top:0%;
margin-left:-455px; margin-top:155px;
visibility:visible;}

.div2 {
background-color:606060; color:8CD8FF;
border:2px solid; border-color:8CD8FF;
width:150px; height:395px; overflow:auto;
position:absolute; z-index:2; left:50%; top:0%;
margin-left:119px; margin-top:155px;
visibility:visible;}

.div3 {
background-color:606060; color:8CD8FF;
border:2px solid; border-color:8CD8FF;
width:370px; height:150px; overflow:auto;
position:absolute; z-index:2; left:50%; top:0%;
margin-left:-455px; margin-top:400px;
visibility:visible;}

.div4 {
background-color:606060; color:8CD8FF;
border:2px solid; border-color:8CD8FF;
width:175px; height:150px; overflow:auto;
position:absolute; z-index:2; left:50%; top:0%;
margin-left:-75px; margin-top:400px;
visibility:visible;}

.div5 {
background-color:606060; color:8CD8FF;
border:2px solid; border-color:8CD8FF;
width:370px; height:150px; overflow:auto;
position:absolute; z-index:2; left:50%; top:0%;
margin-left:-455px; margin-top:560px;
visibility:visible;}

.div6 {
background-color:606060; color:606060;
border:2px solid; border-color:606060;
width:370px; height:20px; overflow:auto;
position:absolute; z-index:2; left:50%; top:0%;
margin-left:-455px; margin-top:720px;
visibility:visible;}




.bbzDiv {content:"Overlay Generator beta";}
</style>
<div class="frm1"><table><tr><td><table><tr><td><table><tr><td>

<style type="text/css">
.mygen { Created using MyGen 2.5 - www.mygen.co.uk }
.mygen { Miscellaneous Properties }
body { cursor:crosshair;}
a:hover { cursor:crosshair;}
</style>

<style type="text/css">
a:link img { border:none; border-color:;  }
a:hover img { border:none; border-color:;  }
a:hover img { filter: progid:DXImageTransform.Microsoft.Pixelate (maxsquare=3) }
</style>

<style type="text/css">
.contactTable {
position:absolute; left:50%;
top:280px; margin-left:-40px;
z-index:3; width:350px; background-color:white;}
.contactTable {visibility:hidden; border:0px !important;}
</style>

<style type="text/css">
table, body {background-color:BGCOLOR;}
div { visibility: visible; }
div table { visibility: visible; }
div table td { visibility: hidden; }
div table table td { visibility: visible; }
div table table { visibility: visible; }
div table table div { visibility: visible; }
table td div div { visibility: visible; }
div table { visibility: hidden; }
[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[iframe]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]
{visibility: hidden; }
Frame1{display: none;}
</style>

<STYLE TYPE="text/css">p {align=justify}
BODY{cursor: url(http://content.cometsystems.com/czcontent/cursors/tinyh.cur);}
a {cursor: url(http://content.cometsystems.com/czcontent/cursors/tinyh.cur);}
</STYLE>

<style type="text/css">
body, textarea, div {
scrollbar-face-color:606060;
scrollbar-highlight-color:606060;
scrollbar-3dlight-color:606060;
scrollbar-shadow-color:606060;
scrollbar-darkshadow-color:606060;
scrollbar-arrow-color:8CD8FF;
scrollbar-track-color:606060;}
</style>


</td></tr></table></td></tr></table></td></tr></table></div>
<style>
BASIC INSTRUCTIONS:
You can delete this section from the code if you don't need it, but it won't affect the looks of your profile in any way.

For every div class (.div1, .div2, etc) you will notice a lot of common properties. To move the layer, use:
** margin-top to move it up and down
** margin-left to  move it left and right

margin-left begins from the center of your page. If you set it to 0px, the top left corner of the div will be located in the center of the profile. If you want the layer in the center of your profile take the width of the div, divide it by 2, and multiply it by -1. (In other words, divide it by 2 and make it a negative number.) For example, your div is 400px wide. Give it a margin-left of -200px and the div layer will sit in the middle of the screen. Now, if you want to move it somewhere else, you will have to experiment with the position.

margin-top should be no less than 150px since anything above that may overlap the MySpace advertisment.

The rest is self explanatory, width for width,  height for height, colors and so on.

Good Luck!
mrk

bbz Overlay Model Generator (beta)
[url=http://bbzspace.com]http://bbzspace.com[/url]
</style>

<style type="text/css">
body {background-color:606060; background-image:url(http://img84.imageshack.us/img84/8606/bw0rrwp6.png); background-repeat:repeat; background-position:top left; background-attachment:fixed;}
td, .text, div, input {color:000000!important;}
span, b {color:8CD8FF!important;}


a:active, a:visited, a:link { font-family:ARIAL; color:F3FF8C;}
a:hover { font-family:ARIAL; color:8CD8FF; text-decoration:none;border-bottom:1px dashed WHITE;}  a.navbar:active, a.navbar:visited, a.navbar:link { font-family:ARIAL; color:F3FF8C;}
a.navbar:hover { font-family:ARIAL; color:8CD8FF; text-decoration:none;border-bottom:1px dashed WHITE;}

table, tr, td, tbody {background-color:transparent; border:0px;}
object {display:block; position:absolute; top:0px; left:0px; visibility:visible;}
table div div, table tr td div font a {visibility:hidden;}
.div1 a, .div2 a, .div3 a, .div4 a {visibility:visible !important;}
.text, table table table table a,
table table table table div,.frm1 {visibility:hidden;}
table table table table div a, .frm1 input {visibility:visible;}
.text, td.text td.text table, .contactTable, .lightbluetext8 {display:none;}
table table, table table td {padding:0px; height:0px;}

.div1 {
background-color:606060; color:8CD8FF;
border:2px solid; border-color:8CD8FF;
width:554px; height:235px; overflow:auto;
position:absolute; z-index:2; left:50%; top:0%;
margin-left:-455px; margin-top:155px;
visibility:visible;}

.div2 {
background-color:606060; color:8CD8FF;
border:2px solid; border-color:8CD8FF;
width:150px; height:395px; overflow:auto;
position:absolute; z-index:2; left:50%; top:0%;
margin-left:19px; margin-top:155px;
visibility:visible;}

.div3 {
background-color:606060; color:8CD8FF;
border:2px solid; border-color:8CD8FF;
width:370px; height:150px; overflow:auto;
position:absolute; z-index:2; left:50%; top:0%;
margin-left:-455px; margin-top:400px;
visibility:visible;}

.div4 {
background-color:606060; color:8CD8FF;
border:2px solid; border-color:8CD8FF;
width:175px; height:150px; overflow:auto;
position:absolute; z-index:2; left:50%; top:0%;
margin-left:-75px; margin-top:400px;
visibility:visible;}

.div5 {
background-color:606060; color:8CD8FF;
border:2px solid; border-color:8CD8FF;
width:370px; height:150px; overflow:auto;
position:absolute; z-index:2; left:50%; top:0%;
margin-left:-455px; margin-top:560px;
visibility:visible;}

.div6 {
background-color:606060; color:8CD8FF;
border:2px solid; border-color:8CD8FF;
width:335px; height:150px; overflow:auto;
position:absolute; z-index:2; left:50%; top:0%;
margin-left:-75px; margin-top:560px;
visibility:visible;}









.bbzDiv {content:"Overlay Generator beta";}
</style>
<div class="frm1"><table><tr><td><table><tr><td><table><tr><td>

<style type="text/css">
.mygen { Created using MyGen 2.5 - www.mygen.co.uk }
.mygen { Miscellaneous Properties }
body { cursor:crosshair;}
a:hover { cursor:crosshair;}
</style>

<style type="text/css">
a:link img { border:none; border-color:;  }
a:hover img { border:none; border-color:;  }
a:hover img { filter: progid:DXImageTransform.Microsoft.Pixelate (maxsquare=3) }
</style>

<style type="text/css">
.contactTable {
position:absolute; left:50%;
top:280px; margin-left:-40px;
z-index:3; width:350px; background-color:white;}
.contactTable {visibility:hidden; border:0px !important;}
</style>

<style type="text/css">
table, body {background-color:BGCOLOR;}
div { visibility: visible; }
div table { visibility: visible; }
div table td { visibility: hidden; }
div table table td { visibility: visible; }
div table table { visibility: visible; }
div table table div { visibility: visible; }
table td div div { visibility: visible; }
div table { visibility: hidden; }
[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[[iframe]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]]
{visibility: hidden; }
Frame1{display: none;}
</style>

<STYLE TYPE="text/css">p {align=justify}
BODY{cursor: url(http://content.cometsystems.com/czcontent/cursors/tinyh.cur);}
a {cursor: url(http://content.cometsystems.com/czcontent/cursors/tinyh.cur);}
</STYLE>

<style type="text/css">
body, textarea, div {
scrollbar-face-color:606060;
scrollbar-highlight-color:606060;
scrollbar-3dlight-color:606060;
scrollbar-shadow-color:606060;
scrollbar-darkshadow-color:606060;
scrollbar-arrow-color:8CD8FF;
scrollbar-track-color:606060;}
</style>


<style type="text/css">
p {color:black; font-family:arial; font-size: 8pt; text-align:justify;line-height:13px;}
b{color:8cd8ff; font-family:arial; font-size: 9pt; text-align:justify; letter-spacing:-1pt; font-weight:bold;}
i, em{color:F3FF8C; font-family:georgia; font-size: 8pt; text-align:justify; font-weight: italic}
U {color:000000; font-family:terminal; font-size:8pt; font-weight:underline; border-bottom:1px solid 000000;text-align:justify;text-transform:uppercase;}
</style>

[*Azarel*]

Have you tried inserting

CODE

margin-left: ##px;

into your stylesheet after .div2? You also have two instances of .div2, which may be causing your div not to shift over to the right if you already tried what I suggested..

[il0vey0ub0i]

i feel stupid lol thank you so much!!

nvm it didnt work. i took the secnd div out && tht didnt solve the problem. its still there like that

[xastallaslyons]

i tried your codes, so i could edit it for you...but when i add those codes, the layout isnt even there...are you missing codes?

[GREASEbaby]

For your second div, take out the margins and dashes so it just says
left: ###px;
top: ###px;

[freeflow]

All your divs have the same z-index. That can easily be your problem. Go through and give each one a different z-index number. Like your first div can be 0 or 1. Second can be 2, third 3, etc. Keeping them all the same can stop it from moving.