我有一个 symfony 项目，我使用 bootstrap 作为样式，并且我想使用 Easy Pie Chart 作为仪表板页面。
所以，在 base.html.twig 中：
<html>
<head>
<meta charset="UTF-8" />
<title>{% block title %} Website {% endblock %}</title>
{% block stylesheets %}{% endblock %}
{% block javascripts %} {% javascripts
'js/jquery-1.10.2.min.js'
'js/bootstrap.min.js'
'js/typeahead.min.js'
'js/jquery.easypiechart.min.js'
'js/jquery.sparkline.min.js' %}
<script type="text/javascript" src="{{ asset_url }}"></script>
{% endjavascripts %}
{% endblock %}
<link rel="icon" type="image/x-icon" href="{{ asset('img/favicon.png') }}" />
</head>
<body>
{% block header %}
{% endblock %}
<div class="container">
{% block body %}
{% endblock %}
</div>
{% block javascripts_after %}
{% endblock %}
</body>
</html>
在我的仪表板页面中，我有：
{% block body %}
<div class="row">
<div class="jumbotron">
<div id="easy-pie-chart" data-percent="55">
55%
</div>
</div>
</div>
{% endblock %}
{% block javascripts_after %}
<script>
$('#easy-pie-chart').easyPieChart({
animate: 2000,
scaleColor: false,
lineWidth: 12,
lineCap: 'square',
size: 100,
trackColor: '#e5e5e5',
barColor: '#3da0ea'
});
</script>
{% endblock %}
但我有这个：
文字不居中，为什么？
我尝试将其添加到我的 css 中，但它也不起作用：
.easyPieChart {
position: relative;
text-align: center;
canvas {
position: absolute;
top: 0;
left: 0;
}
}
如果我检查生成的 html 代码，我有：
<div class="row">
<div class="jumbotron">
<div data-percent="55" id="easy-pie-chart">
55%
<canvas height="100" width="100"></canvas></div>
</div>
</div>
似乎缺少 style =“width: 100px; height: 100px; line-height: 100px;”在div块中，为什么不动态添加？
