2

作成中のワードプレス テーマのフッターにいくつかのソーシャル アイコンを追加する際に問題が発生しています。問題は、アイコンをフッターの右下隅に浮かせることができないことです。

これが私が達成しようとしているものです: 灰色の要素は既存のものであり、赤い要素はソーシャル アイコン ストリップであり、そこに追加したいと考えています。

ここに画像の説明を入力

これを達成できる唯一の方法は、次のように全幅のマージンを手動で追加することです。

.social-icons {
    padding: 0!important;
    margin-left:864px;
    list-style-type: none!important;
        position:absolute;
        bottom:0;

}

これに関する問題は、ウィンドウのサイズを変更すると、ソーシャル アイコンがいたるところに表示されることです。float right がうまく機能することは知っていますが、問題はそうでないことです。

私がこれを試してみると:

.social-icons {
        padding: 0!important;
        list-style-type: none!important;
        position:absolute;
        bottom:0;
        float:right;
}

それは次のようになります:

ここに画像の説明を入力

logo というタイトルの要素はすでに float:right; を使用しています。それで何か関係があるかもしれません。ロゴ div は次のとおりです。

.footerlogo img {

    float: right;

}

問題は、 float:right; を取る場合です。ロゴ div をオフにして float:right; を維持します。ソーシャル アイコン ストリップでは、ソーシャル アイコン ストリップがロゴの位置になり、ロゴが後方に移動します。そのような:

ここに画像の説明を入力

フロートライトを使用する通常の方法では右下にフロートできないため、ソーシャルアイコン(画像の赤い要素)を右下隅に貼り付ける方向に誰かが私を案内して、これを達成する方法を教えてもらえますか、ロゴの位置のみ。

4

3 に答える 3

2

プロパティを 0 に設定してみてくださいright。これにより、要素が最も近くに配置された親の右端に揃えられるはずです。

.social-icons {
    padding: 0!important;
    list-style-type: none!important;
    position:absolute;
    bottom:0;
    right: 0;
}
于 2013-10-10T04:58:15.600 に答える
0

フッターのメイン div をposition:relative

ソーシャル アイコン div を指定しposition:absolute、左と上に値を指定します

于 2013-10-10T08:16:21.637 に答える