0

Impromptu という jQuery プラグインを使用しています。基本的には、きれいなモーダル ボックスのプラグインです。モーダル ボックスの下部にはボタン用のバーがありますが、コードの後半で、追加のボタンをオンザフライで追加するためにさらに JS を使用する必要がありましたが、左側に配置しました。IE を除くすべてのブラウザで正常に表示されます (6 または 8 はテストされていませんが、この問題は IE 7 で発生し、9 で修正されています)。

ここで画像を参照してください: http://screencast.com/t/g1EmKu2KqXfB

左側のボタンには、右側のボタンと同じクラスがありますが、2 つの追加プロパティ:position:relativeとfloat:left. ボタンを保持する の後にdivを追加divしましたclear:leftが、これは何の影響もないようです。

ボタン自体は単純なbutton要素で、構文はかなり重いです。たとえば、これは新しく追加された (問題のある) ボタンの HTML です。

<button value="next" onclick="somefunction()" id="jqi_state0_buttonNext" name="jqi_state0_buttonNext" class="dynamo_temp_button">Next Page</button>

.dynamo_temp_buttonは、前述の と を持つクラスposition:relativeですfloat:left。

ボタンを他のボタンと同じ行に保ち、その位置を左に浮かせたままにする方法を教えてください。

フィドル: http://jsfiddle.net/rRFqv/

4

1 に答える 1

1

右側の2つのボタンにフローティングがなく、IEでは非フローティングとフローティングの配置に問題があります

このデモを試してください:

jsfiddle

div.jqi .jqibuttons{
    text-align: right;
    padding: 5px 0 5px 0;
    border: solid 1px #eeeeee;
    background-color: #f4f4f4;
    overflow: hidden; //added
}
div.jqi button{
    padding: 3px 10px;
    margin: 0 10px;
    background-color: #2F6073;
    border: solid 1px #f4f4f4;
    color: #ffffff;
    font-weight: bold;
    font-size: 12px;
    background-image: none;
    float: right; //added
}
.dynamo_temp_button {
    position : relative;
    float : left!important; //added
}
于 2012-08-12T17:58:34.600 に答える