Question

我有一些相当简单的HTML代码，其中包含几个表来组织各种文本或图像。一切正常，但我需要在屏幕的左右两侧放置一个垂直边框。我可以使用我拉伸的2x2像素图像来做到这一点。当用户的屏幕最大化时，一切看起来都很棒。但是当用户点击“Restore Down”时，边框会保持原位，但桌子会被推倒，以便它们从边界结束的地方开始，这是在屏幕外。换句话说，边界和表格之间的关系对齐都搞砸了。有人知道如何使这种对齐在恢复时保持一致吗？我几乎是html和asp的新手，所以慢慢说。如果有更好的方法来实现这一目标，我会全力以赴。感谢。

以下是相关的代码部分：

<form id="form1" runat="server">
<asp:Image ID="LeftBorder" src="../Images/Border_Blue.jpg" runat="server" 
           WIDTH="15" HEIGHT="1000" BORDER="0" alt="Image Missing" align="left"/>

<asp:Image ID="RightBorder" src="../Images/Border_Blue.jpg" runat="server" 
           WIDTH="15" HEIGHT="1000" BORDER="0" alt="Image Missing" align="right" />

<table id="BannerTable" style="height: 100px">
        <tr>
            <td  width="934px">
            <img src="../Images/Header.jpg" 
                 alt="Image Missing" id="ImgBanner" align="left"/></td>
        </tr>
</table>

Answer 1

有一种更好的方法来做你正在做的事情。

首先---你真的不应该使用表格。

话虽如此，你需要使用div。

容纳一切的容器。

在里面，左边和右边的边框。使用CSS设置背景图像。重复一遍。

你的桌子也需要进入。

<div class="container">
     <div class="leftBorder"></div>
     <div>
        Your table
     </div>
     <div class="rightBorder"></div>
</div>

如果您遇到主容器的问题而没有考虑其孩子的身高，请查看clearfix

屏幕未最大化时，垂直图像边框更改对齐

1 个答案: