1

みんな！私は長年の Web 開発者兼デザイナーですが、これには唖然としました。閉じるボタンのあるアラート (これは Bootstrap ではありません) があります。ホームページに問題なく表示されます。

ここに画像の説明を入力

しかし、送信ページに同じアラートを配置すると、閉じるボタンが下に移動します。

ここに画像の説明を入力

何か案は？ここに私のHTMLがあります:

<div class="alert">
    <div class="alertContents">
        When you submit yo stuff, it comes up in the feed right away.
        <div class="alertClose">&times;</div>
    </div>
</div>

そしてCSS：

.alert {
    width: 100%;
    background-color: #DD7474;
    font-family: 'Raleway', sans-serif;
    font-size: 18px;
    color: #FBFBFC;
    margin: auto;
    border-radius: 2px;
    border-color: transparent;
    border-width: 0px;
    border-style: solid;
}
.alertContents {
    padding-top: 4px;
    padding-bottom: 4px;
    padding-left: 10px;
    padding-right: 10px;
}
.alertClose {
    float: right;
    width: auto;
    height: auto;
    color: #FBFBFC;
    cursor: hand;
}

ありがとう！

4

2 に答える 2

5 
.alert {
 position:relative;
}
.alertClose {
 position:absolute;
 top:5;
 right:5;
}

これはおそらくあなたが必要とするものです。このリンクの #4 をチェックしてください http://www.barelyfitz.com/screencast/html-training/css/positioning/

于 2013-03-29T18:47:48.050 に答える
0

私は使うだろう：

    position: absolute;

次に、

    left: 250px;

編集: これらのコードを CSS に追加してください...ああ、何が起こっていたかを振り返ってみると、次のようなものがあることを確認できます:

    clear: both;

次のような関数:

    <div class="clear"></div>

また

    <br clear="all" />
于 2013-03-29T18:42:13.453 に答える