html - 如何在 div 中居中 jquery 迷你图画布

Question

我似乎无法将 jquery 迷你图创建的画布居中在 div 元素中。画布具有固定宽度，但通常的 css ( display:block; margin:0 auto;) 似乎不起作用。

这是jsfiddle：

http://jsfiddle.net/7V5nH/

有人可以告诉我如何使这幅画布居中吗？

谢谢

Answer 1

我想通了，但答案有点不直观。我必须在包含元素上使用以下 css 属性。

.inlineSparkline {
    display:block;
    text-align:center;
}

这是更新的小提琴。

http://jsfiddle.net/4typS/

用于text-align:center非文本元素对我来说没有意义，但至少它现在有效。

更新：

rajmathantext-align:center在画布的祖父母上使用的建议也有效。这是jsfiddle：

http://jsfiddle.net/GmLSB/

Answer 2

试试看

<div class="chartContainer">
    <div class="inlineSparkline">1,4,4,7,5,9,10</div>
</div>

css

.chartContainer {
    border:1px solid green;
    width:300px;
}

.inlineSparkline {
    display:block;    
    margin: 0 auto;
    text-align:center;
}

演示