今使ってるCSS

念のため もともとのCSSを掲載しておきます。

* { padding: 0; margin: 0; }

body {
font-family: Arial, Helvetica, sans-serif;
font-size: 13px;
}
#wrapper {
margin: 0 auto;
width: 922px;
}
#Main {
background: url(body.gif);
margin-bottom: 0px;
overflow: auto;
width: 100%
}
#header {
color: #333;
width: 902px;
padding: 10px;
height: 100px;
margin: 10px 0px 0px 0px;
background: #D1DBDB;
}
#navigation {
color: #333;
padding: 10px;
margin: 0px 0px 0px 0px;
background: #ABBEBE;
}
#leftcolumn {
display: inline;
color: #333;
margin: 10px;
padding: 0px;
width: 195px;
float: left;
}
#rightcolumn {
float: right;
color: #333;
margin: 10px;
padding: 0px;
width: 683px;
display: inline;
position: relative;
}
#footer {
width: 902px;
clear: both;
color: #333;
background: #ABBEBE;
margin: 0px 0px 10px 0px;
padding: 10px;
}
.clear { clear: both; background: none; }


 

横並びメニュー

ID=Navigation
の部分に「横並びメニュー」をつけましょう。
ClassやらIDやらをいろいろ追加しているとは思いますが、
いまは、いちど「素」に戻ってやりましょうかね。

☆html
<ul>
<li><a href="#">インターネット関連</a></li>
<li><a href="#">趣味と娯楽</a></li>
<li><a href="#">考察メモ</a></li>
<li><a href="#">犬と猫がいる生活</a></li>
</ul>

☆CSS
ul{
margin:0px;
padding:0px;
list-style:none;
}

li{
padding:0em 0.5em;
display:inline;
}


 

サイト作るぞ!

やりますよ!

詳しくは授業で説明します。

まずはこれはフラッシュメモリに保存してください。

これを保存