在Firefox与Chrome中相对表现奇怪

Question

我在Firefox中的两张幻灯片出现问题。在Chrome中，它看起来应该如此，但在Firefox中，元素/图像位于浏览器之外。当我从元素中删除“position：relative”时，位置在浏览器中，但图像的尺寸很奇怪。请看下面的图片：

以下是页面底部黑色方块的标记：

<div class="ca-item ca-item-<%=Featsitems %>">
            <div class="ca-item-main" style="border:2px solid #<%=_dis.FeaturedBorderColor %>">
                <a style="float: left;" href="<%=featNews.ElementAt(i).PageUrl %>">
                    <div class="Feat_Element" style="width: 181px; position: relative; height: 175px;">
                        <div style="width: 181px; height: 100px; border: none; float: left;">
                            <img src="Images/Page_Images/<%=featNews.ElementAt(i).Picture %>" style="width: 181px; border: none; height: 100px;" />
                        </div>
                        <div style="width: 171px; float: left; font-size: 16px; padding: 5px 2px 2px 2px;">


                            <b><%=featNews.ElementAt(i).Title%></b>
                        </div>
                        <div style="width: 171px; float: left; border: none; font-size: 11px; padding: 0px 2px 5px 2px;">
                            <%=featNews.ElementAt(i).Text %>
                        </div>
                    </div>
                </a>
            </div>
        </div>

这是大图像的标记

 <div id="SlideForm" style="height: 320px; display: block; width: 100%;">
</div>

我的问题是为什么会发生这种情况？ firefox处理位置：相对于chrome有多大不同？