Html 由于某些原因，Div width和页面的宽度类似

我有一个有一些div的页面。 HTML:

---

正如您在div中看到的，出于某种原因，Name位于另一个字符串上，logo div位于所有页面的宽度中，但我给它一定的宽度。原因是什么？

问题是您使用

display:inline

设置了utilitiesHeader，但是：width不适用于inline元素！-因此utilitiesHeader不会根据utilitiesLogo的宽度（具有设置的宽度）限制元素

有关宽度属性，请参见：

适用于：除未替换的内联元素外的所有元素，表 行和行组

要修复此设置，请在utilitiesHeader上显示：inline block

---

问题在于，您使用

显示：内联

设置了utilitiesHeader，但：宽度不适用于内联元素！-因此utilitiesHeader不会根据utilitiesLogo的宽度（具有设置的宽度）限制元素

有关宽度属性，请参见：

适用于：除未替换的内联元素外的所有元素，表 行和行组

要修复此设置，请在utilitiesHeader上显示：inline block

---

也许您应该在

div#utilities logo

中添加

display:inline

？你到底想做什么？我不明白你想做什么？也许你应该把

display:inline

添加到

div#utilities logo

？你到底想做什么？我不明白你想做什么？

<div class="utilitiesHeader">
    <div id="utilitiesLogo"></div>
    <div id="utilitiesFIO">Name of user</div>
</div>
<div class="utilitiesContent">
    <div class="utilitiesCommon">Comon</div>
    <div class="utilitiesArchive">Archive</div>
    <div class="utilitiesReadings">Readings</div>
</div>

div#utilitiesLogo {
    width: 226px;
    height: 101px;
    background: url("../images/feelinhome-logo.png") no-repeat 0 0;
    margin: 0;
}
div#utilitiesFIO {
    float:right;
    font-size: 30px;
}
div.utilitiesHeader {
    display:inline;
}