1

我有一个<div>包含两个文本块的元素。一个块在元素的中心对齐，我想将第二个块向右对齐。

我正在尝试执行此操作的页面可以在这里看到。

我尝试<div>在页脚中创建一个内部元素，浮动第二个文本块并应用于float: right它。此解决方案的问题在于，文本第一个（居中）文本元素现在在剩余空间的中心对齐，减去浮动的宽度<div>，而不是在包含元素中居中。

这是我尝试过的代码：

<div id="footer">
      <div id="Valid">
          Valid <a href="http://validator.w3.org/check/referer">HTML</a>
          and <a href="http://jigsaw.w3.org/css-validator/check/referer">CSS</a>
      </div>
  <div id="modified">
         Last modified ...
      </div>
</div>

如何让两个文本块显示在我想要的位置？

编辑：我正在设置一个http://jsfiddle.net/示例（建议的 SSCCE 目前似乎已关闭）

这是示例http://jsfiddle.net/vjmVc/我也尝试使用两个嵌套的 div 元素但没有成功

4

3 回答 3

1

If you want to prevent the right part of taking up the space you can position it absolute. The only thing you would have to keep in mind in that case is set the positioning of the container element (footer) to relative: http://jsfiddle.net/vjmVc/1/

Also keep in mind that when people have a small screen the two element may overlap at some point using this solution.

于 2012-10-21T15:58:37.737 回答
1

显示：内联；浮动：对；n div 内的元素，但这样你就需要颠倒文本的顺序。

于 2012-10-21T15:21:38.147 回答
-1

首先，添加适当的 DOCTYPE。您的页面正在以怪癖模式加载。

<!DOCTYPE html>

或者

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

对于文本

#footer
{
text-align: right;
}

对于对齐

#all
{
margin: 0 auto;
}

编辑

#footer
{
position: relative;
}

#modified
{
position: absolute;
top: 0;
right: 0;
}
于 2012-10-21T15:22:45.737 回答