1

そこで、シンプルなレイアウトを試してみました。基本的に写真多めのインタビュー形式です。

これが私がフォローしている基本的な概念です。

-イントロ

-写真

-インタビュー

にマージントップを設定して<div id="interview">いますが、機能しません。なぜですか? レイアウトの構造に問題があると思います(クロムで要素の検査をクリックした場合)

それを修正する方法は?リンク: http://mysecretathens.gr/kulte_test/osterman.html

4

3 に答える 3

2

これは、フローティング要素をクリアしていないためです。<div id="interview">このように宣言して使用する前に、フロートをクリアするだけですmargin-top: /* Whatever px */

<div style="clear: both;"></div>
<div id="interview"> 

そしてあなたのウェブサイトを見ると、ランディングページに重い画像を使用しているため、帯域幅が不足しているユーザーを悩ませています。lazy loading

于 2013-04-02T14:48:44.297 に答える
2

これを修正するクリーンな方法は、photos 要素に「overflow: hidden」を追加することです。

#photos {overflow:hidden;}
于 2013-04-02T14:51:59.623 に答える
1

上記のすべての画像がフローティングされているため、「機能しません」。そのため、親要素の高さにまたがりません。

div に追加overflow:hiddenして、#photosすべての画像が含まれ、それらが浮き上がらないようにします。これにより、次の要素のマージントップが期待どおりに機能します。

于 2013-04-02T14:50:40.830 に答える