myspace layout css and macs.

[Kings on steeds]

Ok, so i know on first read, if anyone has clicked after seeing the rechid word 'myspace' in the title, you may think i am mad, but i have quite a problem, so a friend asked me to look at his myspace because although he paid a company to build him it, it fails on ALL BROWSERS on a mac, but not the same browsers on a pc... i have tested at several locations, and every outcome is the same, the ap css works fine, except it seems to add a 100px margin to the right, even though i have set ALL paddings and margins to 0, inline and within classes, i can force it back left if i add the distance to its ap, but that then breaks it in normally on pcs. i cant post the link to myspace here cos it will get banned, but the whole code is

<span class="text"><span class="text"><style>
div.pbcredit {
top: 0px;
right: 0px;
width: 66px;
height: 66px;
position: absolute;
}</style>
<div class="pbcredit"><a href="#" target="_blank"><img src="#" alt="Profile designed by specifics removed" border="0" /></a></div>
<style>
<style type="text/css">
<CHEER UP TOP IMAGE - DO NOT TOUCH>
</center>
<style type="text/css">
.mygen { Created using MyGen 2.5 - www.example.com }
.mygen { Background Properties }
table, tr, td { background-color:transparent; border:none; border-width:0;}
body {
background-image:url(#);
background-attachment: fixed;
background-position:center center;
background-repeat:no-repeat;
 }
</style>
<style>
.mygen { Created using MyGen 2.5 - www.example.com }
.mygen { Text Properties }
table, tr, td, li, p, div { color:C0C0C0; } 
.btext { color:454545; } 
.blacktext10 { color:454545; } 
.lightbluetext8 { color:454545; } 
.lightbluetext8 { color:454545; } 
.orangetext15 { color:454545; } 
.redtext { color:454545; } 
.redbtext { color:454545; } 
.text { color:454545; } 
a:active, a:visited, a:link { color:454545; } 
a:hover { color:; } 
a.navbar:active, a.navbar:visited, a.navbar:link { color:454545; } 
a.navbar:hover { color:; } 
a.redlink:active, a.redlink:visited, a.redlink:link { color:454545; } 
a.redlink:hover { color:; } 
</style>
<style>
.Main { position:absolute; left:50%; top:170px; width:800px; z-index:1; margin-left:-400px; padding:0px; border:0px; background-color:transparent;} </style>
<div class="Main"> <table style="width:800px; height:1100px; border:0px solid silver; background-color: transparent;" cellpadding="0" cellspacing="0"> <tr> <td valign="top" width="800">
<p align="center"><img src="#" /><br />
<object height="402" width="800" border="0">
 <param name="allowScriptAccess" value="never" />
 <param name="allowNetworking" value="internal" />
 <param name="movie" value="#" />
 <param name="wmode" value="transparent" />
 <param name="bgcolor" value="000000" />
 <param name="quality" value="high" />
 <param name="loop" value="true" />
 <param name="flashvars" value="#" />
<embed type="application/x-shockwave-flash" allowScriptAccess="never" allowNetworking="internal" src="http://www.emilydesign.co.uk/ant/Cheer_up/Top_Image.swf" height="402" width="800" border="0" wmode="transparent" bgcolor="000000" quality="high" loop="true" flashvars="#" />
</object><img src="#" /><br />
<a href="#">
<img src="#" border="0" /></a><a href="#" border="0" /></a><a href="#"><img src="#" border="0" /></a><a href="#"><img src="#" border="0" /></a><a href="#"><img src="#" border="0" /></a><img src="#" border="0" /><a href="#"><img src="#" border="0" /></a><br />
<img src="#" /><br /><br /><a href="#">
<img src="#" border="0" /></a><a href="#"><img src="#" border="0" width="304" height="190" /></a><a href="#"><img src="#" border="0" width="264" height="190" /></a><br />
<div style="position: absolute; width: 254px; height: 174px; z-index: 3; left: 511px; top: 1072px" id="lager4">
<span class="text"><style>
.bfs_about {
width:180px; height:100px; overflow:auto;
color:white;
font-size:12px;
background-color:transparent;
text-align:left;
visibility:visible;}
</style> 
<div class="bfs_about" style="width: 241px; height: 160px">
<object height="175" width="210">
 <param name="allowScriptAccess" value="sameDomain" />
 <param name="allowFullScreen" value="true" />
 <param name="movie" value="#" />
 <param name="wmode" value="transparent" />
<embed type="application/x-shockwave-flash" allowScriptAccess="sameDomain" allowFullScreen="true" src="#" height="175" width="210" wmode="transparent" />
</object>
<p>
<object height="175" width="210">
 <param name="allowScriptAccess" value="sameDomain" />
 <param name="allowFullScreen" value="true" />
 <param name="movie" value="#" />
 <param name="wmode" value="transparent" />
<embed type="application/x-shockwave-flash" allowScriptAccess="sameDomain" allowFullScreen="true" src="#" height="175" width="210" wmode="transparent" />
</object>
<p>
<object height="175" width="210">
 <param name="allowScriptAccess" value="never" />
 <param name="allowNetworking" value="internal" />
 <param name="movie" value="#" />
 <param name="wmode" value="transparent" />
<embed type="application/x-shockwave-flash" allowScriptAccess="never" allowNetworking="internal" src="#" height="175" width="210" wmode="transparent" />
</object>
</p></p></div>
</span></div>
<div style="position: absolute; width: 242px; height: 116px; z-index: 1; left: 513px; top: 832px" id="lager1">
<style>
.bfs_about {
width:239px; height:170px; overflow:auto;
color:white;
font-size:12px;
background-color:transparent;
text-align:left;
visibility:visible;}
</style> 
<div class="bfs_about" style="width: 239px; height: 170px">
<font color="#FFFFFF"><p>specifics removed
<br />
</p></font></div>
</div></p></td></tr></table></div></span>
<div style="position: absolute; width: 100px; height: 100px; z-index: 2; left: 273px; top: 1003px" id="lager2">
<a href="#"><object height="400" width="415" border="0">
 <param name="allowScriptAccess" value="never" />
 <param name="allowNetworking" value="internal" />
 <param name="movie" value="#" />
 <param name="wmode" value="transparent" />
 <param name="bgcolor" value="000000" />
 <param name="quality" value="high" />
 <param name="loop" value="true" />
 <param name="flashvars" value="#" />
<embed type="application/x-shockwave-flash" allowScriptAccess="never" allowNetworking="internal" src="#" height="400" width="415" border="0" wmode="transparent" bgcolor="000000" quality="high" loop="true" flashvars="#" </object></a><br />
<div style="position: absolute; width: 286px; height: 200px; z-index: 1; left: -3px; top: -384px" id="lager1">
<style>
.bfs_about {
width:260px; height:250px; overflow:auto;
color:white;
font-size:12px;
background-color:transparent;
text-align:left;
visibility:visible;}
</style> 
<div class="bfs_about" style="width: 260px; height: 250px">
<font face="Arial"><font color="#FFFFFF"><b>specifics removed</b><p>
lots of specifics removed<p>
</font></div>
<div style="position: absolute; width: 275px; height: 174px; z-index: 3; left: 430px; top: 857px" id="lager3">
<style>
.bfs_about {
width:180px; height:100px; overflow:auto;
color:white;
font-size:12px;
background-color:transparent;
text-align:left;
visibility:visible;}
</style> 
<div class="bfs_about" style="width: 290px; height: 230px">
<a href="#" border="0" width="265" height="141" /></a><br />
<a href="#">
<img src="#" border="0" width="265" height="141" /></a><br />
<a href="#">
<img src="#" border="0" width="265" height="141" /></a><br />
<a href="#">
<img src="#" border="0" width="265" height="141" /></a><br />
<a href="#">
<img src="#" border="0" width="265" height="141" /></a><br />
<a href="#">
<img src="#" border="0" width="265" height="141" /></a><br />
<a href="#">
<img src="#" border="0" width="265" height="141" /></a><br />
<a href="#">
<img src="#" border="0" width="265" height="141" /></a><br />
<a href="#">
<img src="#" border="0" width="265" height="141" /></a><br />
</div>
<p style="visibility:visible;">
<div style="position: absolute; width: 439px; height: 100px; z-index: 1; left: -443px; top: -35px" id="lager1">
<object height="350" width="425" style="width:410px;height:261px">
 <param name="allowScriptAccess" value="never" />
 <param name="allowNetworking" value="internal" />
 <param name="movie" value="#" />
 <param name="wmode" value="transparent" />
 <param name="quality" value="high" />
 <param name="scale" value="noscale" />
 <param name="salign" value="TL" />
 <param name="flashvars" value="specifics removed" />
<embed type="application/x-shockwave-flash" allowScriptAccess="never" allowNetworking="internal" src="#" height="350" width="425" style="width:410px;height:261px" wmode="transparent" quality="high" scale="noscale" salign="TL" flashvars="specifics removed" />
</object><br /><a href="#"><img src="#" alt="Music" title="Get Music Tracks!" border="0" /></a><a href="#" target="_blank"><img src="#" alt="Playlist" title="Create Your Free Playlist!" border="0" /></a><a href="#"><img src="#" alt="Ringtones" title="Get Ringtones From This Playlist!" border="0" /></a></div>
</p></div>
<div style="position: absolute; width: 100px; height: 100px; z-index: 2; left:302px; top:10px" id="lager5">
<a href="#">
<img src="#" border="0" /></a></div>
<div style="position: absolute; width: 751px; height: 85px; z-index: 1; left: 20px; top: 1260px" id="lager1">
<a href="#">
<img src="#" border="0" /></a>
<textarea rows="5" name="S1" cols="26"><a href="#">
<img src=# border="0"></a></textarea>
</div>
</div></div></span>
<img src="#" width="47" height="1510" />

one of my main problems is that this code has so many 'hacks' to make the style work on myspace that i have no idea what is doing what, what is just broken code and what is needed to do things. i even tried recoding the whole thing into new containers but i couldnt get the containers out of the "about me" box, i assume a hack of sorts is needed but dont know where to start...

basicly... i am looking for some advice on what the hell to do where to start, is there a quick fix (something like <tell type='mac' value='margin-right: -100px;'> would be very usefull ;-p) or is there anything i can do...?

Thanks in advance,
Kings

[edited by: Kings_on_steeds at 1:10 am (utc) on Mar. 16, 2009]

[edited by: swa66 at 11:17 am (utc) on Mar. 16, 2009]
[edit reason] URLs and specifics removed, please see forum charter [/edit]

[swa66]

Cleaning that up is going to be a major task. It's probably easier to just start over on a website you can actually control yourself.

Try first to get it to validate, next move the inline CSS out into a file where it becomes clear what it is doing. (If that is possible with the CMS myspace uses)

Paying for something like that: it turns my stomach.

To find out what's actually handed to browsers, take a look at what the browsers get, not at the input you can control in the CMS.

There is nothing to target macs in CSS. In fact if you would want to do it you'd need to sniff browsers.

[Kings on steeds]

thanks, yer i can put all css in a sheet hosted say on my server and use <link> which is what i did with my clean version. once clean of css and random div's i was left with some very strange code i assmued where the hacks, but when i added to my code just didnt work...i think i will give up, not my site ;-).

Thanks.