Question

我在div下面

   <DIV id=footerTop style="height:15%">    
        <DIV id=footerBottom>
            <DIV id=footerBottomLeft>
                    <DIV id=footerBottomRight>
                        <IMG alt=img src="images/images.jpg">
                    </DIV>
                    <SPAN>
                        <UL><%= new java.text.SimpleDateFormat("yyyy").format(new java.util.Date()) %>blah blah!</UL>                                                       

                    </SPAN>
            </DIV>
        </DIV>
    </DIV>

这里的span并没有在chrome和firefox中正确呈现。但是在IE中工作正常并且标签在div中的一些空格之后开始。在chrome / firefox中打印时没有任何空间。

在上面的包含span的代码div中有以下css设置，它在IE中工作正常，但在chrome

中没有

#footerBottomLeft {
    PADDING-RIGHT: 0px; PADDING-LEFT: 0px; BACKGROUND: #FFFFFF; PADDING-BOTTOM: 0px; MARGIN: 0px; VERTICAL-ALIGN: top; WIDTH: 100%; PADDING-TOP: 0px; HEIGHT: 100%; TEXT-ALIGN: left
}

其中text-align在IE中留有一些空格但在chrome中根本没有空格。

Answer 1

以下是我建议解决问题的解决方案：

样式：

<style>
#footerBottomLeft {
    PADDING-RIGHT: 0px; PADDING-LEFT: 0px; BACKGROUND: #FFFFFF; PADDING-BOTTOM: 0px; MARGIN: 0px; VERTICAL-ALIGN: top; WIDTH: 100%; PADDING-TOP: 0px; HEIGHT: 100%; TEXT-ALIGN: left;
}
p {
text-align:center;PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; MARGIN: 0px; PADDING-TOP: 0px;
}
</style>

HTML：

<DIV id=footerTop style="height:15%">    
        <DIV id=footerBottom>
            <DIV id=footerBottomLeft>
                    <DIV id=footerBottomRight>
                        <IMG alt=img src="images/images.jpg">
                    </DIV>
                    <div>
                        <p ><%= new java.text.SimpleDateFormat("yyyy").format(new java.util.Date()) %>blah blah!</p>                                                       

                    </div>
            </DIV>
        </DIV>
    </DIV>

在Google Chrome和MSIE上，它看起来几乎相同，位于页面顶部并居中。我通过替换＆lt; span＆gt;来实现这一点。使用＆lt; div＆gt;我替换了＆lt; UL＆gt;带有样式的＆lt; P＆gt;。

Answer 2

根据HTML structure的W3C规范：

通常，内联元素可能只包含数据和其他内联元素。

由于UL不是内联元素，因此内联元素SPAN不能成为其容器。此外，UL只能包含LI元素。

在<div> </div> </span> </ul>中，<span>中的<ul>未正确呈现

2 个答案: