今日は、コンテンツのインラインブロック要素を設定するときに、コードを書くとき、常にいくつかの秋の感じになりますが発生しました。
コード：
<p><i></i><span>主页</span></p>
i{display: inline-block;width: 20px;height: 20px;background: url(homepage.svg) no-repeat;}
span{display: inline-block;width:50px;height: 20px;}このような：
理由：
以下のためにinline-blockそこにはない場合の要素、inlineインライン要素は、またはoverflowではないvisible、この要素のベースラインがbaselineそのあるmargin下端、それ以外の場合は、baselineインライン要素の最後の行に含まれる基本コンテンツ要素です。
この場合、i無インライン要素は、そのbaselineことをmargin下縁部は、span「ホーム」のコンテンツがあるので、コンテンツであるbaseline自分自身の（下縁部の「ホーム」）などbaseline。
方法：
1.追加：
i,span{vertical-align:top;}2.追加：
span{overflow:hidden;}原因：オーバーフロー：隠された理由は、オーバーフロー、この問題を解決することができました：そのコンテンツが生成して隠された設定はBFC、独立して、この機能によって、BFCの間でお互いのは、それがテキストや居場所ためではありません。
効果：
展開します。
1がvertical-algin適用される行内元素と、表格单元プロパティ、デフォルト値baseline。
ベースラインは、ベースライン要件要素である其父元素ベースラインと整列します。
2.BFCコンテンツ関連リンク：BFC
結論：そんなにいます。