2

我有一些带有内联样式的 HTML,我将其用于 Blackboard 内容管理系统中的页眉。

它应该看起来像这样: http: //media.norquest.ca/ace/math/screenie-00.png ...在 Chrome 和 IE8 中确实如此。

但在 Firefox 中,它看起来像这样: http: //media.norquest.ca/ace/math/screenie-01.png

代码如下所示:

<center>
<div style="width:806px">

<span style="float:left; margin: auto;">
<img src="Images/course-banner-left-chem30prep.png" />
</span>

<span style="float:right">
<img src="Images/course-banner-right.png" />
</span>

<div style="width:742px; margin-left:0px; text-align:justify; border-top:1px solid black; border-bottom:1px solid black; overflow:hidden">

<p style="float:left; margin-top:0px; margin-bottom:1px; padding-left:0px; font-size:11px">
Instructor: Jason Fahy
</p>

<p style="float:left; margin-top:0px; margin-bottom:1px; padding-left:30px; font-size:11px">
Phone: (780)644-5838
</p>

<p style="float:right; margin-top:0px; margin-bottom:1px; padding-left:30px; font-size:11px">
Office: A324 Edmonton
</p>

<p style="float:right; margin-top:0px; margin-bottom:1px; padding-left:30px; font-size:11px">
jason.fahy@norquest.ca
</p>

</div>

</div>

知道有什么问题吗?

我听说 Blackboard 的样式可以与用户的 CSS 和内联样式进行奇怪的交互,但我不想假设这很可能是我的代码的问题。

干杯,JF

4

1 回答 1

0
<div style="width:806px">
    <div style="width:742px; height:HEIGHT-OF-IMAGES;">
        <div style="float:left; display:inline;">
            <img src="Images/course-banner-left-chem30prep.png" />
        </div>
        <div style="float:right; display:inline;">
            <img src="Images/course-banner-right.png" />
        </span>
    </div>
    <div style="width:742px; margin-left:0px; text-align:justify; border-top:1px solid black; border-bottom:1px solid black; overflow:hidden">
        <p style="float:left; margin-top:0px; margin-bottom:1px; padding-left:0px; font-size:11px">
            Instructor: Jason Fahy
        </p>

        <p style="float:left; margin-top:0px; margin-bottom:1px; padding-left:30px; font-size:11px">
            Phone: (780)644-5838
        </p>

        <p style="float:right; margin-top:0px; margin-bottom:1px; padding-left:30px; font-size:11px">
            Office: A324 Edmonton
        </p>

        <p style="float:right; margin-top:0px; margin-bottom:1px; padding-left:30px; font-size:11px">
            jason.fahy@norquest.ca
        </p>
    </div>
</div>

也许是这样的?你也缺少一个 ; 在您的示例中浮动的末尾。

于 2012-11-14T16:36:11.403 回答