内联块和文本对齐在同一div中不起作用

Question

    <div style="text-align:right;border-radius:6px;padding:4px;border-color:grey;background-color:#D8D8D8;">text</div>

我想将文本向右对齐，也想使用inline-block。但是当我使用inline-block时，它会移动到div的开始位置，即左侧

Answer 1

如果我理解正确，那么您正在尝试将div放在右侧，并且它的宽度将是文本宽度。 您可以使用以下父元素来实现：

<div style="text-align: right;">
  <div style="display: inline-block; text-align:right;border-radius:6px;padding:4px;border-color:grey;background-color:#D8D8D8;">text</div>
</div>

或者像这样用float（并清除）：（如果这样做，则不需要行内显示块）

<div style="float: right; clear: left; text-align:right;border-radius:6px;padding:4px;border-color:grey;background-color:#D8D8D8;">text</div>

希望有帮助。