Div Overlay? Blog is out of it's box. Options

[StaticPulse]

I was wondering if anyone knew how to code div overlays so their positioning was compatible with any screen resolution?

I made a layout, but the blog moves out of it's box in different resolutions, and I wasn't sure how to code it so it didn't?

[Smarmosaur]

please post a link and your codes. :]

[StaticPulse]

please post a link and your codes. :]

http://profile.myspace.com/index.cfm?fusea...endid=393026259

CODE

<p><a href="http://www.msplinks.com/MDFodHRwOi8vd3d3LmNyZWF0ZWJsb2cuY29tL2xheW91dHMvaW5kZXgucGhwP2xheW91dD1teXNwYWNl
2xheW91dHM=" title="Grab Myspace Layouts and Myspace Codes"><img src="http://www.createblog.com/images/link1.gif" border="0" alt="Myspace Layouts" style="position:absolute;top:0px;left:0px;width:10px;height:27px;" /></a></p><style type="text/css">
.contacttable,.whitetext12,.nametext,.lightbluetext8,.orangetext15,.blacktext12,
btext,.redtext,.redbtext{display:none;height:0px;!important;visibility:hidden}
td td td td{border:0px;width:0px;text-align:left;}
table,td,tr{padding:0px;width:;background-color:transparent}
table table table{padding:1px;height:.01%;width:100%;}
table table,table table table table,table,tr,td{height:0px;!important;border:0px;!important}
a.text,table div font a,table div div,.navbar font,tr td font{visibility:hidden;display:none;height:0px;!important;}
table table table table,table table table table td.text, td.text td.text table{display:none;}
td.text table table{display:inline;visibility:visible;}
table td table tr td.text table{visibility:hidden;}
table td table tr td.text table table,table td table tr td.text table table td.text{visibility:visible;}

table div div{visibility:hidden;!important;}

</style>

<style>

body div table td form option{display:none!important;}
body div table td form select{display:none!important;}
body div table td form input{display:none!important;}

td td embed, td td object { position: absolute; top: -500px; left: -500px; }
td td td embed, td td td object { position: static !important; }

body {
background-color:52443c!important;
background-image:url("none");
background-repeat:repeat-y;
background-position:top center;
background-attachment:scroll;
}
td, .text, div, input {
color:000000!important;
font-family:georgia;
font-size:8pt;
font-weight: normal;
text-transform:none;
letter-spacing: 0px;
}




h1 {
margin: 0px;
color: 52443c;
text-align:center;
border-bottom:1px dotted;
border-color:131313;
font-family:georgia;
font-size: 11pt;
font-weight: normal;
letter-spacing: 5px;
text-transform: uppercase;
background-color: transparent;
line-height: 15pt;
padding:2px;
margin-bottom: 5px;
margin-top: 2px;
padding-left:2px;
}
li {
color:fbc36d;
line-height:13px;
font-family:georgia;
letter-spacing:0px;
text-align:justify;
}
b{
color:FF0000;
font-size:8pt;
cursor:default;
line-height:12px;
font-family:georgia;
text-transform:lowercase;
}
s{
color:4D9CF5;
font-size:8pt;
line-height:10px;
letter-spacing:2px;
font-family:georgia;
text-transform:lowercase;
font-weight:bold;
}
i{
color:202020;
font-size:10pt;
line-height:12px;
letter-spacing:0px;
font-family:times new roman;
text-transform:none;
}
u{
color:black;
font-size:12px;
line-height:10px;
letter-spacing:0px;
font-family:tahoma;
border-bottom:2px dashed green;
text-transform:uppercase;}


.x {
background-color:transparent;
border:0px solid;
border-color:black;
overflow:hidden;
position:absolute;
width:1000px;
height:897px;
z-index:1;
left:40%;
top:0%;
margin-left:-321px;
margin-top:90px;
text-align:center;
visibility:visible;
}
.xx {
background-color: transparent;
border:0px solid;
border-color:black;
width:181px;
height:271px;
overflow:auto;
position:absolute;
z-index:2;
left:46%;
top:0%;
margin-left:-35px;
margin-top:140px;
text-align:justify;
visibility:visible
}


</style>


<style type="text/css">
BODY{
scrollbar-face-color:4b3f38;
scrollbar-shadow-color:4b3f38;
scrollbar-highlight-color:4b3f38;
scrollbar-3dlight-color:4b3f38;
scrollbar-darkshadow-color:4b3f38;
scrollbar-track-color:52443c;
scrollbar-arrow-color:6a594f;
}
</style>

<div class="x">
</br>
</div>

CODE

<style type="text/css">
body {background-color:transparent;
background-image:url("http://usera.imagecave.com/ohidontcareanymore/bg.png");
background-attatchment:fixed;
background-position:center center;
background-repeat:repeat;}
</style>


<div class="x"><center>
<IMG NAME="xx" SRC="http://usera.imagecave.com/ohidontcareanymore/incomplete2xx2.png" WIDTH="1000" HEIGHT="895" BORDER="0" USEMAP="x">

<MAP NAME="x">
<AREA SHAPE="rect" COORDS="808,21,884,62" HREF="http://messaging.myspace.com/index.cfm?fuseaction=invite.addfriend_verify&friendID=XXXXXXXXXXXXXX">

<AREA SHAPE="rect" COORDS="807,62,948,93" HREF="http://messaging.myspace.com/index.cfm?fuseaction=mail.message&friendID=XXXXXXXXXXXXXXXXXx">

<AREA SHAPE="rect" COORDS="811,104,902,136" HREF="http://friends.myspace.com/index.cfm?fuseaction=block.blockUser&userID=XXXXXXXXXXXXXXXXXXX">

<AREA SHAPE="rect" COORDS="812,140,885,173" HREF="http://friends.myspace.com/index.cfm?fuseaction=user.viewfriends2&friendID=XXXXXXXXXXXXXXXXXXX">

<AREA SHAPE="rect" COORDS="813,178,973,223" HREF="http://viewmorepics.myspace.com/index.cfm?fuseaction=user.viewAlbums&friendID=XXXXXXXXXXXXXXXXXXXXX">

<AREA SHAPE="rect" COORDS="813,228,989,272" HREF="http://comment.myspace.com/index.cfm?fuseaction=user.viewProfile_commentForm&friendID=XXXXXXXXXXXXXX">

</MAP>
</div>




<div class="xx">
<h1>about me</h1>
<b>bold</b> <u>underline</u> <i>italics</i>, <s>strikeout</s> So here's where you talk about yourself.
Say whatever's on your mind. So here's where you talk about yourself.
Say whatever's on your mind.So here's where you talk about yourself.
Say whatever's on your mind.So here's where you talk about yourself.
Say whatever's on your mind.So here's where you talk about yourself.
Say whatever's on your mind.So here's where you talk about yourself.
Say whatever's on your mind.So here's where you talk about yourself.
Say whatever's on your mind.So here's where you talk about yourself.
Say whatever's on your mind.So here's where you talk about yourself.
Say whatever's on your mind.So here's where you talk about yourself.
Say whatever's on your mind.So here's where you talk about yourself.
Say whatever's on your mind.So here's where you talk about yourself.
Say whatever's on your mind.So here's where you talk about yourself.
Say whatever's on your mind.So here's where you talk about yourself.
Say whatever's on your mind.So here's where you talk about yourself.
Say whatever's on your mind.So here's where you talk about yourself.
Say whatever's on your mind.So here's where you talk about yourself.
Say whatever's on your mind.So here's where you talk about yourself.
Say whatever's on your mind.So here's where you talk about yourself.
Say whatever's on your mind.So here's where you talk about yourself.
Say whatever's on your mind.So here's where you talk about yourself.
Say whatever's on your mind.So here's where you talk about yourself.
Say whatever's on your mind.So here's where you talk about yourself.
Say whatever's on your mind.So here's where you talk about yourself.
Say whatever's on your mind.So here's where you talk about yourself.
Say whatever's on your mind.So here's where you talk about yourself.
Say whatever's on your mind.So here's where you talk about yourself.
Say whatever's on your mind.


</ul>

<h1>extra</h1>
enteranythinghere.
</div>

[fixtatik]

i'd say the problem you're having is because you're positioning the "x" div left:40%; and the "xx" div left:46%;

when you're talking about percentages, it's a percentage browser width / height. if you change either "x" to left:46%; or "xx" to left:40%; and adjust the "margin-left:" accordingly, it'll look fine in all resolutions.

[StaticPulse]

Well I'd say you're a freaking miracle because I've asked about 3409509 different people who've all prescribed me their advice and it none of what they've said has worked, so thank you for that. Seriously, thanks hah.

I could drop down and worship at this point.

[tokyo-rose]

Closed and moved.