1

私は次のhtmlを持っています:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>

    </head>
<body>

    <table style="margin: 250px; width: 200px; height: 100px; background-color: Yellow; table-layout: fixed;">
        <tr>
            <td>
                <div style="margin: auto auto auto -50px; background-color: Green; width:100px; height:50px;">L</div>
                <div style="margin: auto -50px auto auto; background-color: Green; width:100px; height:50px;">R</div>
            </td>
        </tr>
    </table>
</body>
</html>

R と L を含む緑色のボックスを、JS を使用せずに同じ行に配置したいのですが、どうすればよいですか?

4

5 に答える 5

3

「float:left;」を追加するだけです。ボックス L の style 属性に「float:right;」を追加します。ボックス R のスタイル属性に

次に、td タグに valign="top" を追加します。上部に配置する場合は、ボックスの親タグ。

以下のコードを参照してください

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>

</head>
<body>

    <table style="margin: 250px; width: 200px; height: 100px; background-color: Yellow; table-layout: fixed;">
        <tr>
            <td valign="top">
                <div style="float:left;margin: auto auto auto -50px; background-color: Green; width:100px; height:50px;">L</div>
                <div style="margin: auto -50px auto auto; background-color: Green; width:100px; height:50px;float:right;">R</div>
            </td>
        </tr>
    </table>
</body>
</html>
于 2012-07-19T08:05:43.380 に答える
1

cssfloat: leftを DIV L にのみ追加できます。

float: leftまたは、CSSを DIV L とfloat: rightDIV R に追加することもできます。

最終的には、ここで何を達成しようとしているかによって異なります。

于 2012-07-19T08:03:31.777 に答える
1

css スタイル " float:left;" を追加します。これで解決します。

于 2012-07-19T07:54:22.357 に答える
1

css を使用できますdisplay: inline-block。これは、古いバージョンのブラウザーでは機能しないことに注意してください。

または、 を使用することもできますfloat: left。

于 2012-07-19T07:54:44.823 に答える
1 
<div style="margin: auto auto auto -50px; background-color: Green; width:100px; height:50px; float:left;">L</div>
<div style="margin: auto -50px auto auto; background-color: Green; width:100px; height:50px; float:left;">R</div>
于 2012-07-19T07:56:54.430 に答える