※ ChatGPTを利用し、要約された質問です（原文：Dreamweaver CS5 CSSの書き方）
Dreamweaver CS5 CSSの書き方
このQ&Aのポイント
Dreamweaver CS5を使用してサイト作成中の方へ、CSSの書き方についてご教授ください。
Dreamweaver CS5を使用して、サイトのレイアウトを作成し、SubArea内のボタンを2×2の配置にしたいと思っていますが、うまくいきません。
SubArea内のボタンを横並びに配置するために、CSSルールを追加しましたが、うまくいかない状況です。どうすればよいでしょうか？
現在、Dreamweaver CS5 を使ってサイトを作成しています。
添付した画像のように、
bodyをheaderとcontentsに分け、
そのcontentsをMainAreaとSubAreaに分けております。
また、SubAreaのみを編集可能な状態で、
それ以外の箇所をテンプレートに保存して、子サイトを作成しているといった状態です。
そこで、ひとつの子ページ（pageone.html）の中で、添付画像その２のように
SubAreaいっぱいにボタンを４つ２×２の状態で敷き詰めたいと考えております。
そこで、してみたことが、
(1)修正>テンプレートプロパティにてid:をbodyからid:pageoneに変更。
(2)新規CSSルールに body#pageone #contents #SubArea ul li を追加。
(3)(2)のルール定義の中でボックス>Floatを leftを選択。
ここまでしてみたのですが、
まずは、pageoneのSubArea内のボタンがうんともすんともいいません。
（最終的に２×２にしたのですが、まずは横並びにしてみようと思い(3)をしてみたのですが・・）
どうすればよろしいでしょうか？
どうかご教授ください。
また、記載すべき情報がございましたらなんなりとおっしゃってください。
素人の質問ですが、何卒ご対応いただければ幸いです。
よろしくお願いいたします。
お礼
漠然とした質問だったにもかかわらず、 詳しいご回答ありがとうございます。 さらに、お礼が大変遅くなってしまいまして申し訳ござませんでした。 ご指摘のように、 ボタンのサイズをSubAreaに収まるようにきちんと指定しましたら 無事に解決されました。 ありがとうございました。