0

HTML、CSS、Java、および jQuery を数か月間ゆっくりと学習してきましたが、この問題に遭遇したばかりで、過去に解決しましたが、今は本当に行き詰まっています! コンテナーにいくつかの div があり、これにはスライド ダウン メニューが含まれています。メインテキストボックスをメニューの右側に配置したい. 私はfloat:rightを試みましたが、そこには行きますが、並んでは行きません。これはおそらく本当に本当にばかげた質問ですが、助けがないよりも尋ねたいと思いました。「n00b」になってごめんなさい...私のコードが間違って書かれていたり、そのようなものだったらごめんなさい:/

これが私のコードです：

<html>
<head>
<link type='text/css' rel='stylesheet' href='stylesheet.css'/>
<script src="jquery.min.js">
</script>
<script> 
$(document).ready(function(){
        $("#flip").click(function(){
        $("#panel").slideToggle("slow");
        $("#panel2").slideToggle("slow");
        $("#panel3").slideToggle("slow");
    });
});


<div id="container">
<div id="header"><img src="logo.jpg" style="float:left" width="100">Bourne Computing Solutions<img src="logo.jpg" style="float:right" width="100"></div>
<div id="flip">Menu (click to open)</div>
<div id="panel">Home</div>
<div id="panel2">Contents Page</div>
<div id="panel3">Find us</div>
<div id="textbox">TEXT HERE</div>

</div>

</body>
</html>

私のスタイルシート:

    #container
{
    position:absolute;
    left:50%;
    width:1024px;
    height:100%;
    margin-left:-512px;
}



#header
{
    font-family:arial;
    font-size:32px;
    padding:10px;
    width:1002px;
    height:50px;
    text-align:center;
    background-color:#ffffff;
    border:solid 1px #000000;
}

#panel,#flip, #panel2, #panel3
{
    font-family:arial;
    padding:15px;
    width:200px;
    text-align:center;
    background-color:#ffffff;
    border:solid 1px #000000;
}

#panel
{
    padding:10px;
    width:210px;
    display:none;
}

#panel2
{
    padding:10px;
    width:210px;
    display:none;
}

#panel3
{
    padding:10px;
    width:210px;
    display:none;
}

#textbox
{
    font-family:arial;
    font-size:14px;
    padding:10px;
    width:770px;
    height:500px;
    text-align:left;
    background-color:#ffffff;
    border:solid 1px #000000;
    float:right;
}

ばかげて申し訳ありませんが、私たちは皆どこかから始めていると思います...

4

1 に答える 1

0

あなたはこのようにすることができます：

#textbox
{
    font-family:arial;
    font-size:14px;
    padding:10px;
    width:770px;
    height:500px;
    text-align:left;
    background-color:red;
    border:solid 1px #000000;
    position:absolute;
    left:210px;
    top:72px;
}

コードで既に使用している CSS の絶対位置を使用します。

ここでフィドルを確認してください

于 2013-02-28T21:36:42.540 に答える