MySpace- div image background fine in FF but not IE

Discussion in 'CSS' started by immortality, Oct 26, 2008.

  1. #1
    The profile is:
    myspace.com/randyhooker

    It works fine in FireFox but when you open it in IE the background of the one div doesn't position correctly. It shows a small part of the bottom of the background image in the top left corner instead of positioning it to the bottom right.

    The code he uses is:

    <style>
    
    body {
    margin:0;
    padding:0;
    height:100%;
    }
    
    .friendsComments{display:none;}
    
    .userProfileURL { display:none; }
    
    .friendSpace {display:none;}
    
    table.contacttable {display:none;}
    
    .interestsAndDetails {display: none;}
    
    table tr td div font {display: none;}
    table td div {visibility:hidden;}
    table table td div {visibility:visible;}
    tr {background:transparent;}
    table tr td div div {
    visibility:hidden;
    display:none;
    border:0px!important;
    background-color:transparent;
    }
    
    .a { Hide Music Player } embed, object {filter:alpha(opacity=0.1); opacity:0.01;} td td td td embed, td td td object,td.text embed, td.text object {filter:none; opacity:none;} .interestsAndDetails {margin-top:-90px;}
    
    .bg 
    {
    position: absolute; 
    left:0px; 
    top:0px; 
    width:100%; 
    height:100%; 
    overflow: none; background-image:url(http://img266.imageshack.us/img266/2696/backcutre3.png);
    background-position:bottom right
    }
    </style>
    
    <div class="bg">
     
    </div>
    
    <div class="content" style="position: absolute; left:55px;  top:200px; width:500px; height:200px; overflow: hidden;">
    <img name="randal0" src="http://img49.imageshack.us/img49/2/randalfg3.png" width="500" height="200" border="0" usemap="#randal" />
    
    <map name="randal">
    <area shape="rect" coords="46,132,85,151" href="http://www.msplinks.com/MDFodHRwOi8vaG9tZS5teXNwYWNlLmNvbS9pbmRleC5jZm0/ZnVzZWFjdGlvbj11c2Vy" />
    <area shape="rect" coords="100,132,167,151" href="http://www.msplinks.com/MDFodHRwOi8vZnJpZW5kcy5teXNwYWNlLmNvbS9pbmRleC5jZm0/ZnVzZWFjdGlvbj11c2VyLnZpZXdmcmllbmRzJmZyaWVuZElEPTE1NjU1NjYzMA==" />
    <area shape="rect" coords="183,132,255,152" href="http://www.msplinks.com/MDFodHRwOi8vbWVzc2FnaW5nLm15c3BhY2UuY29tL2luZGV4LmNmbT9mdXNlYWN0aW9uPW1haWwubWVzc2FnZSZmcmllbmRJRD0xNTY1NTY2MzA=" />
    <area shape="rect" coords="269,132,300,152" href="http://www.msplinks.com/MDFodHRwOi8vdmlld21vcmVwaWNzLm15c3BhY2UuY29tL2luZGV4LmNmbT9mdXNlYWN0aW9uPXVzZXIudmlld0FsYnVtcyZmcmllbmRJRD0xNTY1NTY2MzA=" />
    <area shape="rect" coords="313,132,391,152" href="http://www.msplinks.com/MDFodHRwOi8vY29tbWVudC5teXNwYWNlLmNvbS9pbmRleC5jZm0/ZnVzZWFjdGlvbj11c2VyLnZpZXdQcm9maWxlX2NvbW1lbnRGb3JtJmZyaWVuZElEPTE1NjU1NjYzMA==" />
    <area shape="rect" coords="403,132,455,152" href="http://www.msplinks.com/MDFodHRwOi8vZnJpZW5kcy5teXNwYWNlLmNvbS9pbmRleC5jZm0/ZnVzZWFjdGlvbj1pbnZpdGUuYWRkZnJpZW5kX3ZlcmlmeSZmcmllbmRJRD0xNTY1NTY2MzA=" />
    </map>
    </div>
    Code (markup):
    Is there something they could change so their profile will work in both FF and IE?
     
    immortality, Oct 26, 2008 IP
  2. drhowarddrfine

    drhowarddrfine Peon

    Messages:
    5,428
    Likes Received:
    95
    Best Answers:
    7
    Trophy Points:
    0
    #2
    Myspace is a coding nightmare and it doesn't run with a proper doctype so IE won't act like modern browsers do. There are ways around it but, back to the beginning, myspace is a coding nightmare.
     
    drhowarddrfine, Oct 26, 2008 IP