我有一个SVG,我试图在一个div居中。div的宽度为900px。SVG的宽度为400px。SVG的左边距和右边距设置为auto。不起作用,它就像左距为0一样(默认值)。

有人知道误差是多少吗?


当前回答

我必须使用

display: inline-block;

其他回答

确保你的CSS如下:

margin: 0 auto;

即使您说您已经将左和右设置为auto,您可能会放置一个错误。当然我们不知道,因为你没有给我们看任何代码。

上面的答案对我都没用。如果SVG来自谷歌图标,请尝试以下方法:

display: inline-block;
width: 24px;
vertical-align: middle;

这些答案对我都没用。我是这么做的。

position: relative;
left: 50%;
-webkit-transform: translateX(-50%);
-ms-transform: translateX(-50%);
transform: translateX(-50%);

Flexbox是另一种方法:添加

.container { 显示:flex; justify-content:中心; }

并将.container类添加到包含svg的div中。

对我来说,修正是添加边际:0 auto;到包含<svg>. xml的元素上。

是这样的:

<div style="margin: 0 auto">
   <svg ...</svg>
</div>