为什么我的Bootstrap列是堆叠的而不是并排的？

cbwuti44 于 2023-11-15 发布在 Bootstrap

关注(0)|答案(1)|浏览(144)

它是简单的div容器，div行，div col-md-9，div col-md-3。这段代码在过去的8年或更长时间里一直有效，突然之间它就不起作用了。
它是Razor中最终批准函的顶部，通常适合信封窗口，右侧有发件人的徽标和地址。

<div class="container">
    <div class="row" style="border: solid 4px blue;">
        <div class="col-md-9" style="border:solid 2px red;">
            <br /><br />
            <br /><br />
            <p>
                @DateTime.Today.ToString("MMMM dd, yyyy")<br />
                <br /><br /><br />
                @Model.Courses.CurrentContactName<br />
                @Model.Courses.ContactBizName<br />
                @Model.Courses.ContactAddress<br />
                @Model.Courses.ContactCity,  @Model.Courses.ContactState @Model.Courses.ContactZip<br />
            </p>
        </div>

        <div class="col-md-3" style="border:solid 2px green;">
            <img src="~/images/oesac_white_2.25.jpg" />
            <br />
            <p style="font-size: 1.3rem;">
                OESAC CEU Committee<br />
                P. O. Box 577 <br />
                Canby, OR 97013-0577 <br />
                Phone: 503/698-6486 <br />
                Email: [email protected] <br />
                http://www.oesac.org

            </p>
        </div>

    </div> @*ROW*@

字符串

这是创建的网页。它有一个“打印”按钮，后面有JavaScript onclick="window.print();。（我将列的边框颜色设置为红色和绿色以进行测试）

x1c 0d1x的数据

这里是打印版本，我使用Chrome中打印预览的屏幕截图来演示。（实际打印页面也是如此）。

的
如果我没有正确解释，请帮助我解释这个问题。引导列的目的是将收件人的地址放在信封窗口的中间，这是可行的，但发件人的徽标/地址被堆叠在下面。