有没有办法集中一个元素，然后直接在其右边有另一个元素？

Question

我正在尝试将文本元素居中，然后解释“这是什么？”在它的旁边。但是当我输入“这是什么？”部分，它显然将原始文本元素偏离中心。有没有办法使用CSS或HTML来解决这个问题？

Answer 1

您可以使用CSS将需要居中的文本元素包裹在div和样式position:absolute中。

Answer 2

以下是您如何做到这一点的示例： http://jsfiddle.net/wgbs4asv/1/

你基本上需要有正确的＆＃34;这是什么？＆＃34; div主要div内部（在主要内容之前），但右侧＆＃34;这是什么？＆＃34; div的CSS设置为：

float: right;
width: 100px;
margin-right: -100px;
position: relative;

（但使用你想要的任何宽度，并使用负边距来匹配宽度）。宽度会偏移主div的位置，但是position: relative的负边距会将其恢复。

Answer 3

这是一个示例，无需为任何元素指定宽度。这应该适用于抛出任何长度的文本。

http://codepen.io/ay13/pen/GJKawz

HTML：

<h1>
    <span>Centered Text <a href="#">What is this?</a></span>
</h1>

CSS：

h1 {
    text-align: center;
}

h1 a {
    position: absolute;
    margin-left: 10px;
}