CSS の 2 列レイアウトで問題が発生しました_html/css_WEB-ITnose

Pacific Trails Resort

• Home


• Yurts


• Activities


• Reservations

Enjoy Nature in Luxury

Pacific Trails Resort offers a special lodging experience on the California North Coast,Relax in serenity with panoramic views of the pacificOcean.

• Private yurts with decks overlooking the ocean


• Activities lodge with fireplace and gift shop


• Nightly fine dining at the Overlook Cafe


• Heated outdoor pool and whirpool


• Guided hiking tours of the redwoods

Pacific Trails Resort

12010 pacific Trails Road
Zephyr,CA 95555
888-555-5555

Copyright©2011 Pacific Trails Resort
logchou@sina.com

css文件：
body{
背景色: #ffffff;
カラー:#666666;
背景画像: url(bg.jpg);
背景リピート: リピートなし;
フォントファミリー: Arial、Helvetica、サンセリフ;
背景添付ファイル: 修正済み。
}
#wrapper{
margin: auto;
幅: 80%;
最小幅: 960px;
背景色: #ffffff;
ボックスシャドウ: 5px 5px 5px #000033;
最小高さ: 500 ピクセル;
}
h1{
背景色: #90c7e3;
カラー:#ffffff;

背景位置: 右;
背景リピート: リピートなし;
高さ: 60ピクセル;
padding-top: 20px;
font-family: Georgia、「Times New Roman」、セリフ;
margin-bottom: 0;
}
#nav{
背景色: #90c7e3;

font-weight: 太字;
フロート: 左;
幅: 140ピクセル;

表示: ブロック;
マージン: 自動;


}
#nav ul{
list-style-type: none;
パディング:0;
マージン: 0;
フォントサイズ: 1.2em;

#nav a{
text-decoration: none;
border-bottom: #000000 solid .1em;
表示: ブロック;
パディング: 0;
}
#nav a:link{
color: #ff0000;
}
#nav a:visited{
color:#ff1100;
}
#nav a:hover{
color: #0000ff;
}
h2 {
font-family: Georgia,"Times New Roman",serif;
カラー:#3399cc;
text-shadow:1px 1px 1px #ccc;
}
#content{
color: #000000;
パディング: 1px 20px 20px 30px;
背景色: #ffffff;
左マージン: 150 ピクセル;
オーバーフロー: 自動;

}
#content img{
float: left;padding-right: 20px;
}
#content ul{
list-style-position:inside;
}
.resort{
font-weight: 太字;
カラー:#000033;
}
h3{
カラー: #000033;
font-family: Georgia、「Times New Roman」、セリフ;
};
#contact{
font-size: 90%;

}
#footer{
font-size: 75%;
フォント スタイル: イタリック体。
font-family: Georgia、「Times New Roman」、セリフ;
text-align: 中央;
クリア: 両方。



}

このようにいじられたインターフェイス、左側には小さなブロックしかなく、背景を完全に覆うことはできませんが、これは固定の高さを設定する必要があります。私は以前このようなネットワークにあまり差を付けていませんでしたが、その後ナビゲーションフロートを実行した後、自動的に高さを調整できるようになりました。オプション)

#wrapper {overflow:hidden;}

#nav{padding-bottom:10000px;margin-bottom:-10000px;}

上面样式を对地に追加します。

この真のものは誂えられます。

#content {background-color: #fff;overflow: hidden;}
#wrapper 追加 {background- color: #90c7e3;}
h1和#nav 去掉 {background-color: #90c7e3;}

这样修正就行了

このウェブサイトの声明

この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。