Question

我知道您可以通过将左右边距设置为auto来居中阻止项目。

但是，是否可以将其与右边缘对齐？怎么做呢？

编辑：不使用使用float: right（因为它似乎不起作用，至少不适用于<ul>）

再次编辑：以下是代码片段：

<td style='vertical-align: top; text-align: center;'>
  <b>Choices:</b><br><br>
  <ul id='orderchoices' style='margin-left: auto; margin-right: auto;'>
    ...
  </ul>
</td>

以下是#orderchoices

的样式

#orderchoices li {
  border: 1px solid #666;
  background: #333 url(images/dark_gloss.png) repeat-x;
  color: #eee;
  margin: 3px;
  padding: 5px;
  cursor: pointer;
  width: 160px;
  font-style: italic;
}

我希望ul

中的td右对齐

Answer 1

<div class="outer">
    <div class="inner">I'm the inner element!</div>
</div>
<style type="text/css">
    .outer { position:relative; }
    .inner { position:absolute; right:0px; }
</style>

如果您的内部元素绝对位于相对位置的容器内，则可以使用top，right，bottom和left来指示内部元素的距离从父容器的边缘开始。

有意义吗？

Answer 2

使用float将块元素右对齐到其父元素。请记住在清除浮动后添加一个元素，以便父级的底部尊重浮动元素的底部。

    <div id="parent">
     <div style="float: right">
      <div>your stuff here</div>
     </div>
     <div style="clear:both"></div>
    </div>

'position：absolute'方法也可以工作，但是当一个元素以这种方式定位时，它会从html流中移除，因此它的父元素不知道绝对定位元素的高度 - 因此它可能是从页面末尾滑落。你可以通过在父母身上设置身高来克服这个问题，但这当然要依赖于这样的事实：a）你知道手前的身高，b）它不会改变

如何将块项目与其父项的右边缘对齐（使用CSS）？

2 个答案: