Question

我有一些内联样式的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

Answer 1

<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>

也许是这样的？你也错过了一个;在你的例子中浮动结束时。

黑板标题：在Chrome和IE8中确定，在Firefox中很不错

1 个答案: