X-Cart forums - CSS problem in IE, Mozilla fine

X-Cart forums (https://forum.x-cart.com/index.php)

- Changing design (https://forum.x-cart.com/forumdisplay.php?f=51)

- - CSS problem in IE, Mozilla fine (https://forum.x-cart.com/showthread.php?t=12958)

CSS problem in IE, Mozilla fine

I have a changing image in the welcome.tpl that is wrapped in a <DIV> tag with inline CSS. In IE, there is a 1px white space at the bottom of my image.

Code:

<div align="center" style="background-color:#FFFFFF; height:398px; padding:none; border-width:1px; border-style:solid; border-color:#E1E7E8">

{literal}

<script language="javascript">

<!--

var b1dis = "<a href=\"";

var bdis = "\"><img src=\"";

var edis = " width=\"620\" height=\"398\" alt=\"Image ALT Tag Here\" title=\"Image Title Here\" border=\"0\"></a>";

var rnumb = "";

var img = "";



rnumb += Math.floor(Math.random()*2);

img = rnumb;

if (img == "0") {

document.write(b1dis+ "product_url/product.php?productid=52" +bdis+ "http://image_url/image1.jpg\"" +edis);

}

if (img == "1") {

document.write(b1dis+ "product_url/product.php?productid=53" +bdis+ "http://image_url/image2.jpg\"" +edis);

}

// -->

</script>

{/literal}

</div>

Does anyone know how to fix that inline CSS, so it doesn't have the space at the bottom in IE?

Thanks!

Mike

I don't know enough about CSS to give you exact code, but look into margin.

I just put the rest of the code up, as I tried using a table and the same thing happened, thus, I think it is in the javascript vs. the CSS.

The code is for a rotating image that links to a product (reduced to only show 2 images here). Mozilla displays this as is, but IE leaves a 1px white area between the image and the border (bottom only). I tried to specify height, but no luck ... ???

Thanks,

Mike

Have you tried, <div style="display:inline;"> or perhaps wrapping the code in {strip} ... {/strip} tags, if those don't work it may be the fact your wrapping javascript in the div tag. :?

Thanks Boomer. Neither of those did the trick. I changed the DIV tags to table and the 1px space was still at the bottom of the image, so it must be in how the javascripted random image is displayed by IE (w/ an added border). Without the border everything looks fine.

Perhaps I'll try a nested table or DIV (didn't work) .... back to the drawing board. Too bad everyone doesn't use Firefox.

- mike