Question

目前我的区块引文中的文字是居中的，但是如果没有大量要引用的文字并且左边框最终离文本太远，则会产生问题。

我希望边框总是距文本5px（通常位于我博客上的图像中心）。

有没有办法将整个块引用（包括左边框）居中，所以它不会卡在一个位置，而文本是唯一居中的？

当前的CSS：

blockquote {
    max-width:390px;
    color: #5c4c40;
    text-align: center; 
    border-left: 3px solid #897860; 
    padding-left: 5px;
    margin-left: 40px; 
}

Answer 1

添加width:auto;和display:table

blockquote {
    max-width:390px;
    color: #5c4c40;
    text-align: center; 
    border-left: 3px solid #897860; 
    padding-left: 5px;
    margin:0 auto;
    background:red;
    width:auto;
    display:table
}

<强> DEMO

Answer 2

<center><blockquote>test test test</blockquote></center>

http://jsfiddle.net/5g0aa3ea/

Answer 3

工作小提琴：http://jsfiddle.net/KYdnJ/34/

<强> HTML：

<div class="quote">
    <blockquote>some random text</blockquote>
</div>

<强> CSS：

.quote {
    text-align:center;
}

blockquote {
    padding:10px 5px;
    border-left:3px solid #ccc; 
    display:inline-block;
    color:#666;
    background:#eee;
}

中心整个blockquote

3 个答案: