I am very new at coding, so please bear with me. I am more than willing to answer any questions or clarify any point in which I am unclear. I have this code which is displaying BEAUTIFULLY in firefox, but it adds a border around my image div in IE and Chrome. I have tried to override the user agent stylesheet (which is apparently where the border is coming from when I inspect the page with firebug) but nothing I do is changing the border displaying in IE and chrome. Has anyone else had this issue? I am finding some posts relating to it, but inevitably the poster responds "I figured it out" and then doesn't post their solution!
I also have a div at the bottom of the site that is rotating images on page refresh, through a list of images. In IE, instead of a new image showing each time you refresh the page, the page is displaying a static image (number 3 in my image list). I have scoured the internet for some sort of reason that this wouldn't be working in IE, but I can't seem to find any code that is more compatible with IE than the javascript I am using currently. The static image issue is the important one, as I have another javascript element on the site that is also not displaying in IE, from the same source, so I figure if someone helps me fix the first one, I can fix the second one on my own.
<script language="javascript">
function banner() { } ; b = new banner() ; n = 0
b[n++]= "<IMG name=randimg CLASS='aligncenter1'>"
b[n++]= "<IMG name=randimg CLASS='aligncenter2'>"
b[n++]= "<IMG name=randimg CLASS='aligncenter3'>"
b[n++]= "<IMG name=randimg CLASS='aligncenter4'>"
b[n++]= "<IMG name=randimg CLASS='aligncenter5'>"
b[n++]= "<IMG name=randimg CLASS='aligncenter6'>"
b[n++]= "<IMG name=randimg CLASS='aligncenter7'>"
b[n++]= "<IMG name=randimg CLASS='aligncenter8'>"
b[n++]= "<IMG name=randimg CLASS='aligncenter9'>"
b[n++]= "<IMG name=randimg CLASS='aligncenter10'>"
i=Math.floor(Math.random() * n) ;
document.write( b[i] )
</script>
The css for one of the elements is below (in case that is somehow adding the border or preventing the images from displaying in IE...?)
img.aligncenter1 {
background: url(images/bottom01.png) no-repeat;
width:662px;
height:395px;
display: block;
border:none;
clear: both;
z-index:100;
margin-top:-35px;
}
Any help would be much appreciated! Please let me know if I haven't posted enough code here.