html - 对齐 div 的对边

Question

我希望绿色框始终位于红色标题的左下角，即使用户放大和缩小网页。

演示：http: //jsfiddle.net/BvQcx/

现在，我希望将一些 margin-left 属性赋予绿色框。或者红色框总是在中心。有人可以为我提供一个 jsfiddle 解决方案吗？解决方案必须是基于 div 的布局。

类似问题：对齐 div 的相对边缘

                         |Red Box|
               |Green Box|

Answer 1

我使用 jQuery 解决了这个问题

http://jsfiddle.net/XX28t/

var sectionSize = $('.leftSection').width();
$('.header').css('marginLeft', sectionSize);

Answer 2

Float:left也为此设置header。我希望这能解决你的问题。

小提琴

为您的标题设置位置，如 relative（用于支持 Left 属性。注意：这不仅是支持 left 和 top 的位置。）。然后将其左侧设置为20％。

小提琴

Answer 3

像这样？

http://jsfiddle.net/XX28t/2/

需要页眉留边距，页眉留白边距应该等于绿框的宽度

margin-left: 20%

Answer 4

试试这个

<table>
  <tr>
<td>&nbsp;</td>
<td><div style="border: 1px solid red">
    This is the header.
</div></td>
  </tr>
  <tr>
<td><div style="border: 1px solid green">
    This is the header.
</div></td>
<td>&nbsp;</td>
  </tr>
<table>

工作示例http://jsfiddle.net/mQBKx/