html - 水平居中 SVG

Question

我似乎无法将我的 SVG Logo 水平居中。

这是我的 CSS:

html body div.body-container div#logo {
    position: absolute; top: 0; left: 0; right: 0; float: none; clear: both;
    width: 100%; max-width: 100%; height: 150px; margin: 0; padding: 0;
    background-image: url(vulco-logo.min.png); background-position: center center; background-repeat: no-repeat; background-size: 175px 55px;
    background-color: rgba(26, 60, 88, 0.9);
    z-index: 20;
}
html body div.body-container div#logo svg {
    position: relative; float: left; clear: none; display: block;
    width: auto; height: 60px; margin: 0 auto; padding: 0; text-align: center;
    fill: #ffffff;
}

HTML:

<div id="logo"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 158.172 50" xmlns:xlink="http://www.w3.org/1999/xlink" preserveAspectRatio="xMixYMid meet">



</svg></div>

我试过显示 block 和边距自动。我试过文本对齐居中，没有。我是不是忽略了什么？

Answer 1

已修复。似乎是 float: left; 造成了所有的麻烦。