0

学校のプロジェクト用にナビゲーション バーを作成しました (基本的な設計を行ってから、mysql データベースを追加しています)。バーはうまく機能しますが、ページの下部までは伸びず、小さなボックスにすぎません。たった今。

これが私のスタイルスクリプトです

style type='text/css'>
#navigation {
 display:block;
 width:150px;
 float:left;
 margin-left:7px;
 margin-right6px;
 margin:5px;
 border-style:solid;
}
#navhead {
 text-align:center;
 margin-left:7px;
 margin-right:6px;
}
#links {
 display:block;
 width:60px;
}
</style>

「フレームの下部まで拡張」という属性がありませんか?

ありがとう！

4

1 に答える 1

1

プロパティを使用する必要がありheightます。heightを 100% (この親の高さ、つまり) に設定でき<body>ますが、高さ + パディング + ボーダー + マージンをレンダリングするため、奇妙に見えます。高さのあるプロパティ
を使用する必要があります。およびプロパティborder-boxで、パディングおよび/またはボーダー (またはデフォルトではなし) をカウントするかどうかを定義できます。と も殺す必要があります。これらの変更後、CSS は次のようになります。 heightwidthmargin-topmargin-bottom

#navigation {
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
            box-sizing: border-box;
    display: block;
    width: 150px;
    height: 100%;
    float: left;
    margin-left: 7px;
    margin-right: 5px;
    border-style: solid;
}
于 2012-11-07T18:53:53.413 に答える