Hey all, So, firstly, sorry! I know myspace is a very lame place where kids put horrible flashing animations everywhere, but I found quite a nice profile layout which I've modified to suit me, cuz I pretty much need a profile to keep in touch with some of my buddies. So the point is, it works fine in FF here, but not Safari or IE. I have no experience maintaining cross compatibility of CSS so I was hoping someone could take a look at the site and the code (which I'll paste in here) and hopefully point out what is causing the problem. My profile is at www.myspace.com/kmo182 The CSS I'm injecting (and the html which follows it) is: Code: <style type="text/css"> .overlay_by_5thirtyone { 5thirtyone.com email: derek@5thirtyone.com ask_first } body{ background-color: FFFFFF; text-align:center; } table, td { background-color: FFFFFF; } .main { position: absolute; left: 50%; top: 125px; width: 1024px; z-index: 1; margin-left: -512px; } .overlay_wrapper { text-align: center; font-family: helvetica, verdana, arial, sans-serif; font-size: 11px; line-height: 1.5em !important; margin-top: 5em; background: url(http://i16.photobucket.com/albums/b7/artificialhero/systemkingsidiota_1600-1.gif) no-repeat bottom right; } h2 { font-family: arial, sans-serif; color: ABC970; font-size: 15px; font-weight: bold; text-transform: lowercase; letter-spacing: -1px; } h2 span { color: acacac; } .overlay_wrapper p { color: 575757; } .overlay_wrapper p a { text-decoration: none; font-weight: normal; color: ABC970; border-bottom: 1px solid; border-color: DDEDBF; } .overlay_wrapper p a:hover { background-color: F4FFD6; } .content_container { margin: 0 auto 0; text-align: left; width: 800px; } .content_left { font-size: 1.1em; width: 430px; float: left; } .middle_links { float: left; margin-top: 5.5em; margin-left: 55px; width: 100px; } .middle_links ul { margin: 0; padding: 0; list-style: none; border: 1px solid; border-color: DDEDBF; border-width: 1px 0 0 0; } .middle_links li { width: 100px; display: block; } .middle_links li a:link, .middle_links li a:visited, .middle_links li a:active { display: block; width: 97px; padding-left: 3px; font-weight: normal; color: ABC970; text-decoration: none; border: 1px solid; border-color: DDEDBF; border-width: 0 0 1px 0; } .middle_links li a:hover { text-decoration: none; color: ABC970; display: block; width: 97px; background-color: EFF6E1; } textarea { color: 575757; width: 425px; height: 125px; padding: 3px !important; background-color: E7F1D3; border: 1px solid; border-color: ABC970; overflow: auto; } .clear { clear: both; } </style> HTML: Code: <div class="main"> <table style="width: 800px; height: 960px; cellpadding: 0px; cellspacing: 0px; background-color: FFFFFF; margin-left: auto; margin-right: auto; text-align:left;"> <tr><td valign="top"> <div class="overlay_wrapper"> <div class="content_container"> <div class="content_left"> <p align="left"><a href="http://viewmorepics.myspace.com/index.cfm?fuseaction=user.viewPicture&friendID=7463519" target="_blank"><img src="http://i16.photobucket.com/albums/b7/artificialhero/mehalf2.gif" border="0" alt="View my pics"></a></p> <p>Ok well I thought I'd mince up my profile because it's been empty for ages. So my name's mike but a lot of people call me yogi, you pick. I like playing, editing and listening to music (guitar, bass, piano, vocals), I like watching movies, I like drawing and digital art, and I like to snowboard when I can afford it. I love to read. Someday I hope to be a real boy.</p> <p>I suppose seeing as I've gotten rid of all the myspace sections, I should put a bit about what specific stuff I like. Music wise, I like a massive range of stuff and I hate making lists, but I guess Regina Spektor, the Postal Service, Panic! at the Disco, and Hit the Lights would all be near the top if I bothered making one. I've got a playlist over there on the right that I update with tracks I'm listening to sometimes. I like to read books by Hunter S Thompson, and I like Noam Chomsky but his stuff is pretty heavy going. Recently I've read Vernon God Little by DBC Pierre, which I absolutely love. I am completely indiscriminate about movies as long as they are funny or have explosions. I play in a band, we are called kmo, and the link is on the right of this page if you want to listen.</p> <h2>Comment<span>Well</span></h2> <form method="post" action="http://comments.myspace.com/index.cfm?fuseaction=user.ConfirmComment"> <input type="hidden" name="friendID" value="7463519"> <textarea name="f_comments" class="comment_textarea" cols="25" rows="8"></textarea> <p><input type="image" src="http://aycu18.webshots.com/image/737/1799309538257637084_rs.jpg" alt="Login" value="Post" /></p> <p>Leave a comment or <a href="http://comments.myspace.com/index.cfm?fuseaction=user.homeComments&friendID=7463519" title="View comment archive">View All</a></p> </form> </div> <div class="middle_links"> <h2>Friends</h2> <ul> <li><a href="http://www.myspace.com/alannajones">alanna</a></li> <li><a href="http://www.myspace.com/politelysmiling">gizmo</a></li> <li><a href="http://www.myspace.com/chalkhillblue">pops</a></li> <li><a href="http://www.myspace.com/kay_em_oh">evans</a></li> <li><a href="http://www.myspace.com/andrea">a n d r e a</a></li> <li><a href="http://www.myspace.com/pies">wennypies</a></li> <li><a href="http://www.myspace.com/jessiepolly">jesz</a></li> </ul> <h2>My<span>Links</span></h2> <ul> <li><a href="http://5thirtyone.com">5ThirtyOne</a></li> <li><a href="http://www.myspace.com/kmomusic">*kmo</a></li> <li><a href="http://www.digg.com/users/artificialhero">dugg</a></li> <li><a href="http://www.last.fm/user/Awoken">last.fm</a></li> </ul> <h2>Try<span>It</span></h2> <ul> <li><a href="http://www.digg.com">digg</a></li> <li><a href="http://finetune.com">finetune</a></li> <li><a href="http://www.threadless.com">Threadless</a></li> <li><a href="http://www.punktastic.com">PunkTastic</a></li> <li><a href="http://www.photobucket.com">Photobucket</a></li> </ul> <br> <embed allowScriptAccess="never" allowNetworking="internal" src="http://www.finetune.com/player/FineTuneShell.swf?playlist=p1273549" quality="high" flashVars="playlist=p1273549" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" width="215" height="220" align="center"></embed> </div> <div class="middle_links"> <h2>My<span>Space</span></h2> <ul> <li><a href="http://mail.myspace.com/index.cfm?fuseaction=mail.message&friendID=INSERT_FRIENDID">Message</a></li> <li><a href="http://collect.myspace.com/index.cfm?fuseaction=invite.addfriend_verify&friendID=INSERT_FRIENDID">Add Me</a></li> <li><a href="http://home.myspace.com/index.cfm?fuseaction=user">Home</a></li> <li><a href="http://browseusers.myspace.com/browse/browse.aspx?">Browse</a></li> <li><a href="http://search.myspace.com/index.cfm?fuseaction=find">Search</a></li> <li><a href="http://invite.myspace.com/index.cfm?fuseaction=invite">Invite</a></li> <li><a href="http://www.myspace.com/index.cfm?fuseaction=film">Film</a></li> <li><a href="http://mail.myspace.com/index.cfm?fuseaction=mail.inbox">Mail</a></li> <li><a href="http://5thirtyone.com/">Blog</a></li> <li><a href="http://favorites.myspace.com/index.cfm?fuseaction=user.favorites">Favorites</a></li> <li><a href="http://forum.myspace.com/index.cfm?fuseaction=messageboard.categories">Forum</a></li> <li><a href="http://groups.myspace.com/index.cfm?fuseaction=groups.categories">Groups</a></li> <li><a href="http://events.myspace.com/index.cfm?fuseaction=events">Events</a></li> <li><a href="http://vids.myspace.com/index.cfm?fuseaction=vids.home">Videos</a></li> <li><a href="http://music.myspace.com/index.cfm?fuseaction=music">Music</a></li> <li><a href="http://classifieds.myspace.com/index.cfm?fuseaction=classifieds">Classifieds</a></li> </ul> <h2>Disclaimer</h2> <ul> <li><a href="http://getfirefox.com" title="Browse with Firefox">Best viewed in</a></li> <li><a href="http://5thirtyone.com/archives/376" title="Read the directions">Make your own</a></li> </ul> </div> <br class="clear" /> </div> </div> </td></tr></table></div> <div style="position: relative; height: 400px; overflow: hidden; border: 0px;"> <table><tr><td><table><tr><td> Thanks in advance for any help or insight anyone can provide. If you want to use the layout (I think it's gorgeous compared to normal myspace profiles... ugh), I got it from here. ArtificialHero
oh if only all myspace pages looked so minimal.... and somebody watches family guy! ..."so put a ****ing sock in it!"
Umm... yeah I do, but how did you get that from my profile, it doesn't say anywhere..... stalker! haha AH
AH: In IE I can still see parts of your myspace sections. And you do know that in IE you're breaking the terms and conditions as you should not cover ANY adverts?
have you checked out w3schools.org yet? you can also go to the w3 consortium site and have the CSS and HTML validated for the current standard. Perhaps you're using outdated tags? I've done just enough scripting/html/css to know that cross browser compatibility is a real PitA, but it is possible to overcome it with a little clever javascript. You might even want to google for some tutorials on cross browser scripting. The site looks great man! Nice to see something that isn't purple and yellow and flashing green perversion. =P
Well, yes I do, but it also doesn't say anywhyere... Try putting a div in there with the background set to white, 100% width and 100% height. It seems to render fine under IE but you can still see parts of the old profile.
*gasp* I'm violating the terms of service?! NOOOOOOOOOOOO! lol - actually I don't think I am. There's only one advert at the top and in my IE my CSS doesn't cover it. The whole point of this thread is to figure out why the CSS is broken in IE, but thanks for your input. In all seriousness, there's an awful lot of people who use this style of profile and myspace haven't shut it down yet, it's been around for ages too. If you follow the link at the bottom of my first post you'll see what I mean. And I do want everyone to notice that I'm not taking credit for this style, it's very ****ing cool and I really like it, but I didn't make it, I just modified it a bit. AH
hehe, it does on the very top of that profile bit it says "a bullet tastes the same in every language..." [sigh]or i could just admit that i stalk you both in my spare time[/sigh]
