【 HP作成質問箱 】

新しい質問は「新規入力」ボタンをクリックしてください。
| Page-1

【HP作成質問箱/詳細】 一覧 / 詳細

  No.9973 テーブルによるページ構成
[ES] [ブラウザ]  09/06/23 (火) 17:35
たびたびすみません。
フレーム処理だといけないという結論にいたり、
ページ構成を変えようと思います。
すべてをテーブルにして、セルとしてそれぞれ内容を描いていこうとしましたが、また問題が。

セルの一つとして表があるのです。
つまり、テーブルの中にテーブルの記述ができてしまって。
そうすると、おおもとのテーブルにあてはめたい色とかが、
中のテーブルの記述が出てきたところで終わってしまって。
テーブルの中にテーブルというのはできないのでしょうか。

意味通じますでしょうか。説明べたですみません。
アドバイスお願い致します。

  No.9974 Re:テーブルによるページ構成
[atom] [ブラウザ]  09/06/23 (火) 18:04
いや、ちょっと意味がわかりません。

テーブルの中のテーブルは何も問題ありませんし、特に指定がなければ、外側の指定がそのまま生きてます。

<table border="1" style="background: #ccffff">
<tr>
<td>

<table border="1">
<tr>
<td>
ちちちち
ととと
</td>
</tr>
</table>

</td>
</tr>
</table>



ちちちち
ととと



  No.9975 Re^2:テーブルによるページ構成
[ES] [ブラウザ]  09/06/25 (木) 14:44
> テーブルの中のテーブルは何も問題ありませんし、特に指定がなければ、外側の指定がそのまま生きてます。

すみません、こちらの記述ミスでした。
ミスをなくさないといけませんね。。
ただ、その問題は、記述ミスだったということで解決するのですが、
テーブルですべて囲もうとすると、まわりに余白ができてしまいました。
すべてをborder指定してみたら、そのようになったのです。
あれ、でもこのatomさまお作りのページはそんなことないですね。テーブルだと駄目?!
また間違っているのでしょうか(^_^;)。

とりあえず、質問の内容については
上記のような原因で解決いたしましたので、ご報告させていただきます。

  No.9976 Re^3:テーブルによるページ構成
[atom] [ブラウザ]  09/06/25 (木) 15:15
これもまた内容がよくわかりませんが、
初心者に多いのが、妙な所に全角空白が入ってると、テーブルの表示が崩れたりします。

こちらとしては普通に行えることができない時は、言葉だけではわかりません。
実際のページを見せていただくのが一番だと思います。

※追加
ひょっとしてページ周りにある微妙な隙間のことでしょうか?
もしそうなら、スタイルシートで次のようにページマージンを「0」にすることで解決します。

body{ margin: 0; }
  No.9977 Re^4:テーブルによるページ構成
添付 [ES] [ブラウザ]  09/06/26 (金) 16:06
教えていただいたもの正解です。
よくわかりますね。私がボケてるのでしょうか。。

現況を添付します。上がCSS記述分。後半がhtml記述分です。

今困っていることは、テーブルのなかのテーブルがあるところの大きさです。
tdとしての幅を80pxくらいに、また中のテーブルをもっと右に持っていきたいのですが、動きません(泣)

どこがおかしいのでしょうか。
  No.9978 Re^5:テーブルによるページ構成
[atom] [ブラウザ]  09/06/26 (金) 16:50
tableには無条件で隙間を作る設定が入ってます。

cssで設定するなら「table」に「border-collapse: collapse;」を追記してください。

タグで次のように指定したのと同じです。
<table cellspacing="0">

それと、隙間を開けたくないなら、tdに背景色を指定するのではなく、table自体に背景色を設定するという手もあります。

  No.9979 Re^6:テーブルによるページ構成
[atom] [ブラウザ]  09/06/26 (金) 17:05
上記(No.9978)の返信はページ全体のテーブルの僅かな隙間もなくす方法でした。

今回の質問。
cssがちょっと込み入ってますね。

できるだけ不要な設定を無くし、シンプルにした方がいいですよ。

tdとしての幅を80pxにしたいということですが、このテーブルは「width:700px」と指定されてます。
セルが6つしかありませんので、ひとつのセル幅は
700px ÷ 6 = 約116px となり、
セルのwidthを指定しても無視されます。

便利な機能ですが、
tableの幅を指定して、セル幅を自動にするか、
table幅を無指定にして、セル幅を指定するか、
のどちらかにしないと設定がぶつかってしまいます。

それと、tableを右にずらせたいのなら内側のテーブルに「margin-left:200px;」などと指定すればいいでしょう。
margin-rightはありますが、margin-left指定はありません。
margin-rightの指定が単なるミスなら、削除すべきでしょう。
左詰めであればmargin-leftだけで充分でしょう。


  No.9981 Re^7:テーブルによるページ構成
[ES] [ブラウザ]  09/06/29 (月) 15:39
返信遅くなり申し訳ありません。

> できるだけ不要な設定を無くし、シンプルにした方がいいですよ。

そうなのでしょうね。。ただ、何が不要か判断するのが難しいです。

> tdとしての幅を80pxにしたいということですが、このテーブルは「width:700px」と指定されてます。
> セルが6つしかありませんので、ひとつのセル幅は
> 700px ÷ 6 = 約116px となり、
> セルのwidthを指定しても無視されます。

すみません、ここは”幅”ではなく、”高さ”でした。
中のテーブルの高さは40px指定、そのテーブルが入るtdは
80pxに指定したいのですが、どう見ても80px以上に
なっている状況です。

> それと、tableを右にずらせたいのなら内側のテーブルに「margin-left:200px;」などと指定すればいいでしょう。
> margin-rightはありますが、margin-left指定はありません。
> margin-rightの指定が単なるミスなら、削除すべきでしょう。
> 左詰めであればmargin-leftだけで充分でしょう。
>
左詰めでなく、右詰めを教えてくださったのですよね。
marginの説明は何度読んでもたまに?なことをしてしまいます。
left指定ですね、わかりました。
  No.9983 Re^8:テーブルによるページ構成
[atom] [ブラウザ]  09/06/29 (月) 18:44
何が不要かがわからないなら、ひとつひとつ、削除したり入れたりしていけばいいでしょう?

入れても外しても変わりないのであれば必要ないということです。
タグだけに限らず、細かい設定もひとつひとつチェックしてみればいいだけの事です。


> 中のテーブルの高さは40px指定、そのテーブルが入るtdは
> 80pxに指定したいのですが、どう見ても80px以上に
> なっている状況です。

それなら「td.top-l2」のcssに「height:80px;」を追加すればいいだけです。


> 左詰めでなく、右詰めを教えてくださったのですよね。

違います。
現在左詰めになってるから「magin-left」は効果があっても「margin-right」は指定しても意味がないでしょう?
って言う意味です。

「margin」とは余白のことでその端からどれだけの余白を作るか?という意味です。
左詰め(左に寄ってる)なのに、その右側にマージン(余白)を指定しても意味がないでしょう?
という意味です。

わからなければ、簡単なサンプルを自分で作り、簡単なcssを設定して確認すればいいのです。
言葉で理解できないなら、ご自分で設定し、体で覚える必要があります。


  No.9985 Re^9:テーブルによるページ構成
[ES] [ブラウザ]  09/06/30 (火) 16:27
> タグだけに限らず、細かい設定もひとつひとつチェックしてみればいいだけの事です。

がんばります!

> > 中のテーブルの高さは40px指定、そのテーブルが入るtdは
> > 80pxに指定したいのですが、どう見ても80px以上に
> > なっている状況です。
>
> それなら「td.top-l2」のcssに「height:80px;」を追加すればいいだけです。

そのとおりでした。入れてるつもりでしたが、抜けていました(^_^;)


> > 左詰めでなく、右詰めを教えてくださったのですよね。
>
> 違います。
> 現在左詰めになってるから「magin-left」は効果があっても「margin-right」は指定しても意味がないでしょう?
> って言う意味です。
>
> 「margin」とは余白のことでその端からどれだけの余白を作るか?という意味です。
> 左詰め(左に寄ってる)なのに、その右側にマージン(余白)を指定しても意味がないでしょう?
> という意味です。

詳しく書いていただいてありがとうございます。
やっと意味を理解できました。不出来ですみません。

> 言葉で理解できないなら、ご自分で設定し、体で覚える必要があります。

練習あるべし、ですね。
なかなかHP作りに時間を割く余裕がありませんが、
忘れない程度には作っていかないと。

いろいろありがとうございました。
なんとかページ構成はできた模様です。
ここに具体的な内容をどう記述していくか、
また壁にブチあたりながらやっていくことになるでしょう。
質問もさせていただくと思いますが、よろしくお願いいたします。



| Page-1

 一覧 / 詳細


page update:19/01/17 01:34

Copyright (c) 2000-2009, all Rights Reserved & Produced by atom