Hey guys, this topic is about myhappyending's Tokyo layout. Note that I did PM him first, and he responded saying that he was on vacation and didn't really have time to help. I don't know what else to do other than post on the forum, so sorry if I'm breaking forum rules.
Anyway, the layout is aligned left by default. A lot of layouts are like this, and I've generally been able to fix them by inserting <center> tags or through some other basic method, but I've spent hours trying everything I can think of, including joespace's tutorial and searching online, and I've come up with nothing that works. It's driving me crazy. This is partially because my CSS knowledge is pretty limited. Does anyone know how I can center align the entire layout, specifically in Firefox and IE? Thanks in advance.
Full Version: centering a myspace div layout
CODE
.div {
background:none; overflow:auto;
position:absolute;
top:90;
text-align:;
visibility:visible;
left:50%;
margin-left:-500px;
z-index:0;}
background:none; overflow:auto;
position:absolute;
top:90;
text-align:;
visibility:visible;
left:50%;
margin-left:-500px;
z-index:0;}
play with margin-left
&change the name of .div, if you name it something else.
i think that would help?
Try changing the DIV's features. If it says left:#px;, change it to left:%50;. This puts everything in the center. Now, to adjust it, you add margin-left:-#px;. Just replace the # with the amount of pixels you need. For example, if you have a layout that's 800 pixels wide, you're going to put -400px because that's 50% of 800.
I hope I was understandable.
I hope I was understandable.
Alright, I've managed to align the text and contents of the div to center using the left:%50 tip, which is more than I accomplished before. Unfortunately I can't get it to line up correctly with the backgroud. This seems to be the line of code that affects the position of the background.
I tried changing left:0px; but adding any %# seems to give me the same result which is misaligned with the text. I think this relates to what Anarchy said about margin-left:-#px, but I'm not sure where to place it.
CODE
.image {height:562px; width:700px; top:100px; left:0px
I tried changing left:0px; but adding any %# seems to give me the same result which is misaligned with the text. I think this relates to what Anarchy said about margin-left:-#px, but I'm not sure where to place it.
Why is everyone so lazy? 
Anyway, try this, only replace the about me box:
Anyway, try this, only replace the about me box:
CODE
<p><a href="http://www.createblog.com/layouts/index.php?layout=myspace_layouts" 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><p><a href="http://www.createblog.com/layouts/index.php?layout=myspace_layouts" title="Grab Myspace Layouts and Myspace Codes"><img src="http://cbimg9.com/layouts/08/07/29015aa.gif" border="0" alt="Myspace Layouts" style="position:absolute;top:0px;left:0px;width:10px;height:27px;" /></a></p><style>
body table {margin-top:-50000px;}
body td table, body div table {margin-top: -0;}
table, tr, td {background-color:transparent;}
body div table form{display:none;}
body table div form{display:block;}
div div table div {display:none;} .clearfix table div div {display:block;}
.profile, div ul {display:none !important; }
.navigationbar {display:none;}
.a {hide top search and shortcuts bar}
div table div form {display:none !important}
.bodyContent div td div div select {margin-top:-1000px;}
.bodyContent div div select {width:0px !important;}
.bodyContent table table div form {display:inline !important;}
body { background-color:000000; background-image:url(); cursor:crosshair; a:hover { cursor:crosshair;} background-repeat:repeat; background-attachment:scroll; background-position:top left; }
.nava:link, .nava:active, .nava:visited {font-family:small fonts; color:FFFFFF; font-size:7px; line-height:10px; font-weight:normal; display:block; text-transform:uppercase; text-align:center; height:7px;}
.nava:hover {color:000000; background-color:white; text-decoration:none; cursor:crosshair; letter-spacing:6px; border:0px solid black; text-align:center;}
h1 {font-family:courier new; background-color:white; color: black; font-size:12px; letter-spacing:-1px; font-weight:normal; text-transform:lowercase;}
.about { background-color:transparent; border:0px solid; border-color:000000; width:299px; height:310px; position:absolute; overflow:auto; top:126px; margin-left: 92px; left:50%; font-family:arial; color:white; font-size:11px; line-height:11px; text-decoration:none; font-weight:normal; letter-spacing:; scrollbar-face-color:black; scrollbar-arrow-color:white; scrollbar-track-color:black; scrollbar-shadow-color:black; scrollbar-highlight-color:black; scrollbar-3dlight-color:black; scrollbar-darkshadow-color:black; filter:chroma(color=647A19); text-align:left;}
.content2 { background-color:transparent; border:0px solid; border-color:000000; width:299px; height:185px; position:absolute; overflow:auto; top:445px; left:50%; margin-left: 92px; font-family:arial; color:white; font-size:11px; line-height:11px; text-decoration:none; font-weight:normal; letter-spacing:; scrollbar-face-color:white; scrollbar-arrow-color:black; scrollbar-face-color:black; scrollbar-arrow-color:white; scrollbar-track-color:black; scrollbar-shadow-color:black; scrollbar-highlight-color:black; scrollbar-3dlight-color:black; scrollbar-darkshadow-color:black; filter:chroma(color=647A19); text-align:left;}
td td embed, td td object{position:absolute; left:0px; top:0px; width:1px; height:1px;}
td.text embed {width:260px; height:38px;}
.image {height:562px; width:700px; top:100px; left:50%; margin-left: -400px;
position:absolute; overflow:none;}
</style><div class="image">
<img src="http://cbimg9.com/layouts/08/07/29015ab.png"></div>
body table {margin-top:-50000px;}
body td table, body div table {margin-top: -0;}
table, tr, td {background-color:transparent;}
body div table form{display:none;}
body table div form{display:block;}
div div table div {display:none;} .clearfix table div div {display:block;}
.profile, div ul {display:none !important; }
.navigationbar {display:none;}
.a {hide top search and shortcuts bar}
div table div form {display:none !important}
.bodyContent div td div div select {margin-top:-1000px;}
.bodyContent div div select {width:0px !important;}
.bodyContent table table div form {display:inline !important;}
body { background-color:000000; background-image:url(); cursor:crosshair; a:hover { cursor:crosshair;} background-repeat:repeat; background-attachment:scroll; background-position:top left; }
.nava:link, .nava:active, .nava:visited {font-family:small fonts; color:FFFFFF; font-size:7px; line-height:10px; font-weight:normal; display:block; text-transform:uppercase; text-align:center; height:7px;}
.nava:hover {color:000000; background-color:white; text-decoration:none; cursor:crosshair; letter-spacing:6px; border:0px solid black; text-align:center;}
h1 {font-family:courier new; background-color:white; color: black; font-size:12px; letter-spacing:-1px; font-weight:normal; text-transform:lowercase;}
.about { background-color:transparent; border:0px solid; border-color:000000; width:299px; height:310px; position:absolute; overflow:auto; top:126px; margin-left: 92px; left:50%; font-family:arial; color:white; font-size:11px; line-height:11px; text-decoration:none; font-weight:normal; letter-spacing:; scrollbar-face-color:black; scrollbar-arrow-color:white; scrollbar-track-color:black; scrollbar-shadow-color:black; scrollbar-highlight-color:black; scrollbar-3dlight-color:black; scrollbar-darkshadow-color:black; filter:chroma(color=647A19); text-align:left;}
.content2 { background-color:transparent; border:0px solid; border-color:000000; width:299px; height:185px; position:absolute; overflow:auto; top:445px; left:50%; margin-left: 92px; font-family:arial; color:white; font-size:11px; line-height:11px; text-decoration:none; font-weight:normal; letter-spacing:; scrollbar-face-color:white; scrollbar-arrow-color:black; scrollbar-face-color:black; scrollbar-arrow-color:white; scrollbar-track-color:black; scrollbar-shadow-color:black; scrollbar-highlight-color:black; scrollbar-3dlight-color:black; scrollbar-darkshadow-color:black; filter:chroma(color=647A19); text-align:left;}
td td embed, td td object{position:absolute; left:0px; top:0px; width:1px; height:1px;}
td.text embed {width:260px; height:38px;}
.image {height:562px; width:700px; top:100px; left:50%; margin-left: -400px;
position:absolute; overflow:none;}
</style><div class="image">
<img src="http://cbimg9.com/layouts/08/07/29015ab.png"></div>
QUOTE(allvanishing @ Jul 29 2008, 01:00 PM) 
Why is everyone so lazy?
Anyway, try this, only replace the about me box:
Anyway, try this, only replace the about me box:
You sir (or ma'am) are amazing. Worked perfectly. Thank you so much! Problem solved.
Topic Closed & Moved
This is a "lo-fi" version of our main content. To view the full version with more information, formatting and images, please click here.