0

我正在设计一个响应式网站，这意味着布局会发生变化。当尽可能宽地查看时，我的块引用会换行到下一行。我希望它在同一条线上。

在此处输入图像描述

我已经设法通过添加一些来修复打开的报价，text-indent但是我无法移动关闭的报价。

我的 HTML：

<blockquote><p class="blockQuote">In recent years we have noticed a growth in demand for audit services, by enterprises with foreign investment, partly because of the demands on the part of organizations such as the CPI and the central bank.</p></blockquote>

CSS：

blockquote  {
    font-family: serif;
    font-style: italic;
    color: #000;
    margin: 0px 0px 10px 0px;
}

blockquote:before   {
    content: "\201C";

}

blockquote:after    {
    content: "\201D";

blockquote:before   {
        position: absolute;
        width: 60px;
        height: 60px;
        line-height: 1;
        font-size: 120px;
    }

    blockquote:after    {
        position: absolute;
        width: 60px;
        height: 60px;
        line-height: 1;
        font-size: 120px;
    }

当我使用一个span元素时，关闭引号会修复，但打开引号看起来应该会进一步向上移动。

在此处输入图像描述

4

1 回答 1

1

添加<span>标签而不是<p>标签。在这里工作 JSFiddle https://jsfiddle.net/jfmf4ujc/

于 2016-02-22T15:01:28.930 回答