0

OK、ここに行けば：http: //opportunityfinance.net/Test/2013conf/index.html

2つのレイアウトの問題に気付くでしょう

問題1-画像はゴールドより下にある必要があります

<h4>3つのロゴのこの画像は、「ゴールド」タグの下にある必要があります。しかし、何らかの理由でそれはしません。タグ内に画像を下に揃える必要のある他のdivがあるため、<div>タグに位置を割り当てました。これは正しく行われますが、 HTMLの下には表示されません。relative<h4>Gold</h4>

次のレイアウトの問題：

フッターはボディコンテンツをカットしています

ページの下部にフッターを表示するために、私は地獄のように努力してきました。簡単そうに聞こえますか？間違い！しかし、divが一番下になるようになったので、その上の上部のdivが切り取られているようです。したがって、すべてのコンテンツが表示されているわけではありません。代わりに、フッターの下にプッシュされます。どうすればこれを修正できますか？その上にパディングを入れようとしましたが、今どこで、そして/またはどのように確認しますか？フッターのmargin-topも何もしないようです。

これに関するどんな助けも大いに感謝されます。私はこの単純なレイアウトを整理するために地獄のように苦労してきました。ページのサイズ変更に合わせてテキストのサイズを変更しているので、流動的なレイアウトにする必要があります。これは、これら2つの問題を除いて、完全に問題ないようです:(

編集

コンテナdivを100ピクセルの高さの値に適用すると、次のようになります。

高さ100ピクセルのdiv

と3つの画像の間にスペースがありすぎてい<h4>Gold</h4>ます。少なくともこれはOperaの場合です。これに対する可能な回避策はありますか？

4

1 に答える 1

0

これが1つの修正です

.body {
    background-color: #FFFFFF;
    padding: 2em 2em 52px 0;
}

1つのdivに3つのロゴがあり、そのdivに高さを追加します。たとえば

element.style {
    height: 100px;
    position: relative;
    width: 100%;
}

かなり基本的なものです。ここを調べてclearfix'sくださいhttp://css-tricks.com/snippets/css/clear-fix/

divにfloatまたはを追加すると、そのスペースが放棄され、親は内部に何も存在しないために何も存在しないと見なすようになり、これらの問題が修正されます。理由は、3つのロゴがすべてまたはposition:absolute;reserveddivheightclearfixfloatedabsolute;

これはresult私が得る

ここに画像の説明を入力してください

于 2013-03-27T00:53:28.347 に答える