人力検索はてな
モバイル版を表示しています。PC版はこちら
i-mobile

ホームページ制作について質問です。
<div id="center">
<div id="1">aaa</div>
</div>

私がいまつくっているホームページは
ヘッダー
メインは左右2個に分かれていて
フッター
という形です。
ヘッダーとメインの左側はうまく配置出来ました。
しかし、メインの右側のcssが全く表示されません。
メインのソースは
<div id="in">
<div id="left">
左側のソース・・・・
</div>

<div id="center">
<div id="1">aaa</div>
</div>

</div>

ここで右側に一行目に表示ででてくるはずの<div id="1">のcssが全く表示されません。
<div id="●●●">〜</div>の中に<div id="●●●"></div>は入れられないとかそういった単純なことなのでしょうか?
一様cssには
#center {
float: right;
height: 1420px;
width: 585px;
}
#1 {
margin: 0px;
padding: 50px 20px 20px 15px;
height: 105px;
background-image: url(../images/t1_17.jpg);
background-repeat: no-repeat;
}
とかいています。
宜しくお願いします。

●質問者: kasai-de_eb
●カテゴリ:インターネット ウェブ制作
✍キーワード:.jpg AAA background-image background-repeat CSS
○ 状態 :終了
└ 回答数 : 4/4件

▽最新の回答へ

1 ● Q-A
●30ポイント ベストアンサー

id や class の先頭は数字はルール違反です。気をきかして表示してくれるブラウザもあるのですが、一応アルファベットを1の前に入れてみてください。

これでだめなら、情報不足です。全体の html と css の記述を教えてもらえませんか。in や left の記述も必要です。

http://kurageya.fc2web.com/web/style/0syurui.html

◎質問者からの返答

ありがとうございました。直りました。

またお願いします。


2 ● kn1967
●30ポイント
<html>
<head>
 <title>テスト</title>
 <style>
 div.header { background-color:#FF0000; }
 div.left { background-color:#00FF00; width:30%; float:left;}
 div.right { background-color:#0000FF; width:70%; float:left;}
 div.footer { background-color:#FF0000; clear:both; }
 </style>
</head>
<body>
 <div class="header">ヘッダーだよ?? </div>
 <div class="left">メニューだよ</div>
 <div class="right">ボディだよ</div>
 <div class="footer">フッターだよ??</div>
</body>
</html>

説明用に必要最低限のものしか書いてないので高さとか幅とかは適宜調整してくださいね。

http://q.hatena.ne.jp/ダミー

◎質問者からの返答

直りました。

丁寧にありがとうございました。


3 ● wizemperor
●30ポイント

id属性値に「1」などの数字から始まるものは使えませんのでそれが原因でしょう。

一応、数字から始まるID値でもCSS側は問題ありません。


|>>

#\1 {

margin: 0px;

padding: 50px 20px 20px 15px;

height: 105px;

background-image: url(../images/t1_17.jpg);

background-repeat: no-repeat;

}

<<|

のように\を付けると、ハイフン、数字などから始まるID値を使えます。

ですが、「1」はアルファベットから始めるものに変更したほうがよいでしょう。

http://q.hatena.ne.jp/

◎質問者からの返答

直りました。

ありがとうございます。

#1が原因でした。


4 ● makoohira
●30ポイント

文から推測できる範囲では、

divは中身がないときの、無指定のwidth,heightは0です。

背景画像の左の方が背景色と同じなら表示していないように見えるでしょう。

#1にwidthを指定するか、文章なのでdiv id="1"をp id="1"に置き換える。

(無論 id="1"は文法上正しくないので変える)

背景画像の相対urlはcssから見た位置になります。

読み込むhtmlやcgiからの位置になっているなら、変えましょう。

urlを書かれたほうが、より詳しい回答が得られると思います。

p.s.

divの中にdivを置くのは間違いではないです。

ただ、body,div直下にインライン要素を置く(「body」から「要素」までの入れ子をたどったとき、divしかないという状況)のは、なるべく避けましょう。

あくまでdivは「区切り」として使い、要素はp,h1,h2,ol,ul,li,dl,dt,ddなどで包みましょう。

<body>

<div>

<div>あああ</div>

</div>

</body>

<body>

<div>

<p>あああ</p>

</div>

</body>


ダミー(自己サイト) http://oh.skr.jp/web/

◎質問者からの返答

ありがとうございました。

丁寧にかいていただきありがとうございました。

関連質問


●質問をもっと探す●



0.人力検索はてなトップ
8.このページを友達に紹介
9.このページの先頭へ
対応機種一覧
お問い合わせ
ヘルプ/お知らせ
ログイン
無料ユーザー登録
はてなトップ