Weird Ad overlapping and wide body |
![]() ![]() |
Weird Ad overlapping and wide body |
Jun 10 2007, 05:23 PM
Post
#1
|
|
|
Member ![]() ![]() Group: Member Posts: 12 Joined: Apr 2007 Member No: 515,948 |
Hey there again guys. I know I was just here not too long ago asking about some problems in IE, but since nobody seemed to know what the answer was, I set it to a premade layout until I could make a new layout that worked in both. Well, I've got one that's working in both at the moment, but at the same time, they both are having a little bit of a problem with the ad. For some reason in both browsers, some color goes up on top of the right half of the ad and the text entry bar at the top (the text links up there are already hidden. Also, for some reason, my page is spreading off to the right a bit too much for what seems to be no reason. I'm thinking it might just be that I need to set it to line up on the right to stop that edge, but I'll mess with that later. Anyways, my current code (with a lot of content not yet put in it) is as follows:
CODE <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;} </style> <style type="text/css"> body { background-color: F9FFEE; background-image: url("http://img78.imageshack.us/img78/6958/backgroundai9.jpg"); background-position: top left; background-repeat: repeat-x; background-attachment: scroll; } .content { width: 250px; height: 350px; position: absolute; top: 351px; left: 50%; margin-left: -378px; overflow: auto; } .cover { width: 800px; height: 770px; position: absolute; top: 0px; left: 50% margin-left: -400px; background-color: F9FFEE; background-image: url("http://img78.imageshack.us/img78/6958/backgroundai9.jpg"); background-position: top left; background-repeat: repeat-x; background-attachment: scroll; } img.lyt { width: 800px; height: 600px; position: absolute; top: 185px; left: 50%; margin-left: -400px; border: 0px !important; } .categ {font-size: 9pt; font-weight: bold; display: block; color: F9FFEE; background-color: 656F56; width: 94%; margin-bottom: 3px; } a.redlink:active, a.redlink:hover, a.redlink:visited, a.redlink:link {color: AAAAAA} .redtext, .redbtext {font: 8pt arial; color: AAAAAA} .blacktext10 {font: 8pt arial; text-transform: uppercase; font-weight: bold; color: CC3333} .cbox {border: 1px solid white; background-color: white; color: CC3333; font-family: "Trebuchet MS", sans-serif; font-size: 7pt;} a img {border: 0px;} </style> <div class="cover"> </div> <map name="lytmap"> <area shape="poly" coords="396,125,451,161,434,185,380,151" href="http://home.myspace.com/index.cfm? fuseaction=user&MyToken=d39fc6d7-0904-40d5-a7cb-a22ec76f7c7e" /> <area shape="poly" coords="376,164,406,178,396,205,357,190" href="http://collect.myspace.com/index.cfm? fuseaction=invite.addfriend_verify&friendID=20421132" /> <area shape="poly" coords="318,250,386,235,397,268,327,283" href="http://collect.myspace.com/index.cfm? fuseaction=block.blockUser&userID=20421132" /> <area shape="poly" coords="335,299,415,266,434,291,346,335" href="http://messaging.myspace.com/index.cfm? fuseaction=mail.message&friendID=20421132" /> <area shape="poly" coords="647,152,738,134,741,173,650,195" href="http://home.myspace.com/Modules/ViewFriends/FriendsView.aspx? friendID=20421132" /> <area shape="poly" coords="674,233,745,232,746,266,675,264" href="http://blog.myspace.com/index.cfm? fuseaction=blog.ListAll&friendID=20421132" /> <area shape="poly" coords="678,267,780,282,771,319,661,294" href="http://comment.myspace.com/index.cfm? fuseaction=user.viewComments&friendID=20421132" /> <area shape="poly" coords="659,311,746,351,735,381,639,344" href="http://viewmorepics.myspace.com/index.cfm? fuseaction=user.viewPicture&friendID=20421132" /> </map> <img src="http://img510.imageshack.us/img510/6052/base2ff2.jpg" class="lyt" usemap="#lytmap" /> <div class="content" style="border: 0px solid white"> <div align="center" style="font-weight: bold; font-size: 10pt; letter-spacing: 1px"> <br> </div> <br /> <center><span class="categ">care to comment...?</span> <form action="http://comments.myspace.com/index.cfm?fuseaction=user.confirmComment" method="post" style="margin: 0px"> <input type="hidden" name="friendID" value="20421132"/> <textarea name="f_comments" style="width: 200px; height: 40px; text-align: center; background-color:FFF4F4; overflow: auto" class="cbox">Comment goes where?</textarea><br /> <input type="submit" value="SEND" class="cbox" style="font-weight: bold; letters-spacing: 1px; width: 140px; background-color: 656F56" /><br /> </form></center> <P> <span class="categ">random</span> <br> <br> <br> <P> <br> <br> <br> <br> <br> <br> <br> <P> <P> <span class="categ">about me</span> <P> <P> <P> <P> <P> <P> <P> <div align="left"> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> < </div> <P> <P> <div align="left"> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> </div> <P> <p> <br><br> <br><br> <p> <P> <P> <span class="categ">who i'd like to meet...</span> <P> <P> <span class="categ">friends</span> <P> <marquee direction=right> </div> </marquee> (as I said, I have most of the content broken up, but haven't put it in yet, that's why there's all the breaks and everything.) Anyways, I hope that someone can tell me what I'm doing wrong to fix it, and also, if you want to see the page as it is right now, I have it up on an alternate account for testing at http://profile.myspace.com/index.cfm?fusea...40-7fbeebba039f Thanks in advance! |
|
|
|
Jun 10 2007, 05:54 PM
Post
#2
|
|
![]() Senior Member ![]() ![]() ![]() ![]() ![]() ![]() Group: Staff Alumni Posts: 1,188 Joined: Jan 2006 Member No: 364,198 |
CODE .cover { width: 800px; height: 770px; position: absolute; top: 0px; left: 50% margin-left: -400px; background-color: F9FFEE; background-image: url("http://img78.imageshack.us/img78/6958/backgroundai9.jpg"); background-position: top left; background-repeat: repeat-x; background-attachment: scroll; } ^Remove the background color, F9FFEE, and replace it with transparent - background-color:transparent; is what it should look like. |
|
|
|
Jun 10 2007, 06:09 PM
Post
#3
|
|
|
Member ![]() ![]() Group: Member Posts: 12 Joined: Apr 2007 Member No: 515,948 |
Thanks for the suggestion. I tried that out and it didn't change much, but after fiddling around and looking at the source code for my poly-mapped base image, I noticed that the ad on that profile doesn't show up at all, so I think part of the problem might be with my base image coding, though I'm not sure what. I'll have to mess around a little more with it, but for now, I'm still up to suggestions!
|
|
|
|
Jun 10 2007, 07:56 PM
Post
#4
|
|
|
Member ![]() ![]() Group: Member Posts: 12 Joined: Apr 2007 Member No: 515,948 |
Well, I looked around at the coding and finally figured out that it was using the background image in the cover section that was covering up the ad. so that's taken care of now I believe. I still however am trying to figure out why the page is tiling so far off to the right. I set the main overlay image to align on the right, and yet it still tiles quite a ways over and makes the page have a bottom scroll bar, which I don't want to happen. As of now, my current coding is set to
CODE <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;} </style> <style type="text/css"> body { background-color: F9FFEE; background-image: url("http://img78.imageshack.us/img78/6958/backgroundai9.jpg"); background-position: top left; background-repeat: repeat-x; background-attachment: scroll; } .content { width: 250px; height: 350px; position: absolute; top: 351px; left: 50%; margin-left: -378px; overflow: auto; } .cover { width: 800px; height: 770px; position: absolute; top: 0px; left: 50% margin-left: -400px; color: transparent; background-color: transparent; background-position: top left; background-repeat: repeat-x; background-attachment: scroll; } img.lyt { width: 800px; height: 600px; position: absolute; top: 185px; right: 0px; margin-left: -400px; border: 0px !important; background-color: transparent; background-image: url("http://img78.imageshack.us/img78/6958/backgroundai9.jpg"); } .categ {font-size: 9pt; font-weight: bold; display: block; color: F9FFEE; background-color: 656F56; width: 94%; margin-bottom: 3px; } a.redlink:active, a.redlink:hover, a.redlink:visited, a.redlink:link {color: 111808} .redtext, .redbtext {font: 8pt arial; color: 111808} .blacktext10 {font: 8pt arial; text-transform: uppercase; font-weight: bold; color: 111808} .cbox {border: 1px solid white; background-color: white; color: 111808; font-family: "Trebuchet MS", sans-serif; font-size: 7pt;} a img {border: 0px;} </style> <div class="cover"> </div> <map name="lytmap"> <area shape="poly" coords="396,125,451,161,434,185,380,151" href="http://home.myspace.com/index.cfm? fuseaction=user&MyToken=d39fc6d7-0904-40d5-a7cb-a22ec76f7c7e" /> <area shape="poly" coords="376,164,406,178,396,205,357,190" href="http://collect.myspace.com/index.cfm? fuseaction=invite.addfriend_verify&friendID=20421132" /> <area shape="poly" coords="318,250,386,235,397,268,327,283" href="http://collect.myspace.com/index.cfm? fuseaction=block.blockUser&userID=20421132" /> <area shape="poly" coords="335,299,415,266,434,291,346,335" href="http://messaging.myspace.com/index.cfm? fuseaction=mail.message&friendID=20421132" /> <area shape="poly" coords="647,152,738,134,741,173,650,195" href="http://home.myspace.com/Modules/ViewFriends/FriendsView.aspx? friendID=20421132" /> <area shape="poly" coords="674,233,745,232,746,266,675,264" href="http://blog.myspace.com/index.cfm? fuseaction=blog.ListAll&friendID=20421132" /> <area shape="poly" coords="678,267,780,282,771,319,661,294" href="http://comment.myspace.com/index.cfm? fuseaction=user.viewComments&friendID=20421132" /> <area shape="poly" coords="659,311,746,351,735,381,639,344" href="http://viewmorepics.myspace.com/index.cfm? fuseaction=user.viewPicture&friendID=20421132" /> </map> <img src="http://img510.imageshack.us/img510/6052/base2ff2.jpg" class="lyt" usemap="#lytmap" style="background-color: transparent" /> <div class="content" style="border: 0px solid white"> <div align="center" style="font-weight: bold; font-size: 10pt; letter-spacing: 1px"> <br> </div> <br /> <center><span class="categ">care to comment...?</span> <form action="http://comments.myspace.com/index.cfm?fuseaction=user.confirmComment" method="post" style="margin: 0px"> <input type="hidden" name="friendID" value="20421132"/> <textarea name="f_comments" style="width: 200px; height: 40px; text-align: center; background-color:FFF4F4; overflow: auto" class="cbox">Comment goes where?</textarea><br /> <input type="submit" value="SEND" class="cbox" style="font-weight: bold; letters-spacing: 1px; width: 140px; background-color: 656F56" /><br /> </form></center> <P> <span class="categ">random</span> <br> <br> <br> <P> <br> <br> <br> <br> <br> <br> <br> <P> <P> <span class="categ">about me</span> <P> <P> <P> <P> <P> <P> <P> <div align="left"> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> < </div> <P> <P> <div align="left"> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> <br> </div> <P> <p> <br><br> <br><br> <p> <P> <P> <span class="categ">who i'd like to meet...</span> <P> <P> <span class="categ">friends</span> <P> <marquee direction=right> </div> </marquee> If anyone has any suggestions about that part of it, I'd certainly be extremely thankful!! |
|
|
|
Jun 10 2007, 08:37 PM
Post
#5
|
|
|
t-t-t-toyaaa ![]() ![]() ![]() ![]() ![]() ![]() ![]() ![]() Group: Official Member Posts: 19,821 Joined: Apr 2004 Member No: 11,270 |
Try not to double post next time :)
When positioning on myspace you don't need to align it right. You just use left and position it that way. So this is what your div should look like to be aligned : position: absolute; top: #px; left: #px; width: #; height: #; or position: absolute; top: 0%; left: 50% margin-top: #px; margin-left: #px; width: #; height: #; Choose one of those and just position your image that way instead of align right. |
|
|
|
Jun 10 2007, 09:47 PM
Post
#6
|
|
|
Member ![]() ![]() Group: Member Posts: 12 Joined: Apr 2007 Member No: 515,948 |
Ahh, sorry about the double post, I meant to just edit and got doing something and forgot, haha. Anyways, I was using the align right because I had seen it in some of the pre-made layouts, and I wanted my main image to be aligned on the right side so no extra would show up on it's right edge. I tried doing some of that other aligning, but I couldn't get it to line up the way I want it. Also, after moving it around, it still seems to tile way too far off the right said no matter where I put it. I was basically just wondering if there was a way to stop it from tiling so far to the right, especially because when I use the right alignment, the image itself is lining up exactly where it should be, but the background keeps on tiling. Sorry if I'm being complicated, I'm just trying to figure out if I'm doing something really wrong, or if it's just a weird mistake.
[Edit:] Sorry about everything, I messed around with the cover setting and after moving it over an extra 400 pixels, it seems to balance out. Still not really sure why, haha, but it worked out the way I wanted it to. Thanks for the help though guys! |
|
|
|
![]() ![]() |