0

私はCSSを初めて使用し、最近DIVを希望する場所に配置しようとしていますが、floatやmarginなどのプロパティがいくつかあり、混乱しています。下の画像では、白い div をロゴの右側に配置しようとしています。

まだ投稿に写真を載せられないので、こちらにアップしました

HTML :

<body>

<header>
    <div class="header">
        <div class="logo">
            <img src="images/logo.png" />
        </div>

        <nav>
            <div class="navigation">

            </div>
        </nav>
    </div>    

</header>

</body>

css:

.header {
    max-width:1200px;
    min-width:200px;
    height:170px;
    margin:0 auto;
    margin-top:10px;
    background-color:rgba(0, 0, 0, 0.5);
    border-radius:3px;

}

.logo {
    width:230px;
}

.logo img {
    margin-left:20px;
    margin-top:31px;
    border-right:solid  #FFF 1px;
    padding-right:33px;
    height:auto;
    width:auto;

}


.navigation {
    width:500px;
    height:100px;
    margin-left:200px;
    background-color:#FFF;
    position:fixed;


}
4

2 に答える 2

1

を に変更し.navigationます。それぞれの高さに応じて縦に並べて追加しますposition:fixed;position:inline-blockmargin-top

またはfloat:left;、それらの両方を使用できます

于 2013-07-22T12:02:13.840 に答える
0

以下の .logo imgと.navigationを CSS に置き換えてください。ここにフィドルがあります

.logo img {
    margin-left:20px;
    margin-top:31px;
    border-right:solid  #FFF 1px;
    padding-right:33px;
    height:auto;
    width:auto;
    float:left;
}


.navigation {
    width:500px;
    height:100px;
    margin-left:200px;
    margin-top:31px;
    background-color:#FFF;
    position:fixed;

}
  • フロートを配置: 左; あなたの.logo img {...}クラスで
  • margin-top:31px を配置します。あなたの.navigation {...}クラスで
于 2013-07-22T12:03:49.057 に答える