css - 使引用从文本开始，而不是在标签处

Question

我无法让我的报价站在我的文字旁边。目前，引号位于最左侧。

如果不将文本居中，它可以正常工作，但是当我将文本居中时，事情会变得混乱。

.center
{
    text-align:center;
}

http://jsfiddle.net/BpTdL/2/

如何确保引用在我的文本旁边，而不是标签？

谢谢！

Answer 1

尝试将blockquote:beforeCSS 块更改为

blockquote:before {
    content: "\201C";
    font-size: 80px;
    color: #7a7a7a;
    display: inline;
    line-height: .22;
    vertical-align: middle;
}

您需要稍微调整块引用的填充顶部，因为它会被切断

jsfiddle

Answer 2

你只需要改变这个：

blockquote:before {
  display: block;
  padding-left: 10px;
  content: "\201C";
  font-size: 80px;
  position: absolute;
  left: -20px;
  top: -20px;
  color: #7a7a7a;
  }

为了这：

blockquote:before {
  display: block;
  padding-left: 10px;
  content: "\201C";
  font-size: 80px;
  position: absolute;
  left: 0px;           /* Line changed */
  top: -20px;
  color: #7a7a7a;
  }

这是你想要的吗？演示

Answer 3

您可以尝试将引号和文本放在 div 中，并使用此代码移动它们

position:relative;
left:100px;

这将允许您移动到您想要的位置