Html 为什么我的div没有对齐而呈现错误_Html_Css

Html 为什么我的div没有对齐而呈现错误

html css

Html 为什么我的div没有对齐而呈现错误,html,css,Html,Css,我不明白它为什么这样做这是css .logo{ position:relative; height:200px; width:200px; border-style:solid; border-width:1px; float:left; padding:0px; } .feed{ position:absolute; height:200px; width: 100%; border-style:solid; border-width:1px; overflow: auto; white

我不明白它为什么这样做

这是css

.logo{
position:relative;
height:200px;
width:200px;
border-style:solid;
border-width:1px;
float:left;
padding:0px;

}

.feed{
position:absolute;
height:200px;
width: 100%;
border-style:solid;
border-width:1px;
overflow: auto;
white-space:nowrap;
padding:0px;
margin:0px;

}


.feed-box {
position:relative;
width: 550px;
height: 200px;
display:inline-block;
border-style:solid;
border-width:1px;
padding:0px;
margin:0px;
white-space:normal;
top:10px;


}

这是html

<body>

<div class="feed">

        <div class="feed-box"  >

        </div>

        <div class="feed-box"  >
          grefewfgewfgewgwe grefewfgewfgewgwe grefewfgewfgewgwe grefewfgewfgewgwe grefewfgewfgewgwe grefewfgewfgewgwe grefewfgewfgewgwe grefewfgewfgewgwe
        </div>

        <div class="feed-box"  >
          grefewfgewfgewgwe grefewfgewfgewgwe grefewfgewfgewgwe grefewfgewfgewgwe grefewfgewfgewgwe grefewfgewfgewgwe grefewfgewfgewgwe grefewfgewfgewgwe
        </div>

        <div class="feed-box"  >
          grefewfgewfgewgwe grefewfgewfgewgwe grefewfgewfgewgwe grefewfgewfgewgwe grefewfgewfgewgwe grefewfgewfgewgwe grefewfgewfgewgwe grefewfgewfgewgwe
        </div>

        <div class="feed-box"  >
          grefewfgewfgewgwe grefewfgewfgewgwe grefewfgewfgewgwe grefewfgewfgewgwe grefewfgewfgewgwe grefewfgewfgewgwe grefewfgewfgewgwe grefewfgewfgewgwe
        </div>



</div>




</body>


grefewfgewfgewgwe grefewfgewfgewgwe grefewfgewfgewgwe grefewfgewfgewgwe grefewfgewfgewgwe grefewfgewfgewgwe grefewfgewfgewgwe
grefewfgewfgewgwe grefewfgewfgewgwe grefewfgewfgewgwe grefewfgewfgewgwe grefewfgewfgewgwe grefewfgewfgewgwe grefewfgewfgewgwe
grefewfgewfgewgwe grefewfgewfgewgwe grefewfgewfgewgwe grefewfgewfgewgwe grefewfgewfgewgwe grefewfgewfgewgwe grefewfgewfgewgwe
grefewfgewfgewgwe grefewfgewfgewgwe grefewfgewfgewgwe grefewfgewfgewgwe grefewfgewfgewgwe grefewfgewfgewgwe grefewfgewfgewgwe

我不知道如何解释，所以这里有一个链接

为什么div没有对齐，而是在下降。我想要的是这样的东西

<body>

<div class="feed">

        <div class="feed-box"  >
                      grefewfgewfgewgwe grefewfgewfgewgwe grefewfgewfgewgwe grefewfgewfgewgwe grefewfgewfgewgwe grefewfgewfgewgwe grefewfgewfgewgwe grefewfgewfgewgwe
        </div>

        <div class="feed-box"  >
          grefewfgewfgewgwe grefewfgewfgewgwe grefewfgewfgewgwe grefewfgewfgewgwe grefewfgewfgewgwe grefewfgewfgewgwe grefewfgewfgewgwe grefewfgewfgewgwe
        </div>

        <div class="feed-box"  >
          grefewfgewfgewgwe grefewfgewfgewgwe grefewfgewfgewgwe grefewfgewfgewgwe grefewfgewfgewgwe grefewfgewfgewgwe grefewfgewfgewgwe grefewfgewfgewgwe
        </div>

        <div class="feed-box"  >
          grefewfgewfgewgwe grefewfgewfgewgwe grefewfgewfgewgwe grefewfgewfgewgwe grefewfgewfgewgwe grefewfgewfgewgwe grefewfgewfgewgwe grefewfgewfgewgwe
        </div>

        <div class="feed-box"  >
          grefewfgewfgewgwe grefewfgewfgewgwe grefewfgewfgewgwe grefewfgewfgewgwe grefewfgewfgewgwe grefewfgewfgewgwe grefewfgewfgewgwe grefewfgewfgewgwe
        </div>



</div>




</body>


grefewfgewfgewgwe grefewfgewfgewgwe grefewfgewfgewgwe grefewfgewfgewgwe grefewfgewfgewgwe grefewfgewfgewgwe grefewfgewfgewgwe
grefewfgewfgewgwe grefewfgewfgewgwe grefewfgewfgewgwe grefewfgewfgewgwe grefewfgewfgewgwe grefewfgewfgewgwe grefewfgewfgewgwe
grefewfgewfgewgwe grefewfgewfgewgwe grefewfgewfgewgwe grefewfgewfgewgwe grefewfgewfgewgwe grefewfgewfgewgwe grefewfgewfgewgwe
grefewfgewfgewgwe grefewfgewfgewgwe grefewfgewfgewgwe grefewfgewfgewgwe grefewfgewfgewgwe grefewfgewfgewgwe grefewfgewfgewgwe
grefewfgewfgewgwe grefewfgewfgewgwe grefewfgewfgewgwe grefewfgewfgewgwe grefewfgewfgewgwe grefewfgewfgewgwe grefewfgewfgewgwe

但是由于某种原因，如果我没有相同数量的文本，那么它就会出错

删除

空白：正常来自CSS中的.feed box{}
。这是不必要的，并且对代码做了一些奇怪的事情。替换它溢出：自动
您需要将垂直对齐：顶部
添加到中。提要框
：
我之所以把它放进去，是因为文本没有在div中换行。我希望divs提要框向右滚动，但我知道的唯一方法是使用空格：nowrap；但这会导致文本无法换行too@Mental-说明我已经更新了我的答案来处理你想要的。