HP作成の表の位置指定について

質問

現在ビルダー12でHPを作成しているのですが、どうしてもわからないことがあります。

表の中に表を作ったのですが、外側の表を基準にして中の表の位置指定をしたいのですが、何度やってみても上手くいきません。（外側の表の左端から下に何ピクセル、右に何ピクセルの場所に指定という具合にしたいのですが…）
自分なりにいろいろ調べてみたのですが、おそらくスタイルシートでクラスをつけて、それから相対指定を用いて設定するのだと思うんですけど、具体的にどうすればよいのかがわかりません。
絶対指定を用いると自分の置きたい場所に置けるのですが、それだと環境によってレイアウトがずれてしまうので使わないようにしたいのですが…
ご返答お待ちしています。

回答No.2

liv2007 · ベストアンサー

少し前に投稿された質問の方も読みました。
同じことに関する解決方法として、今回のことを試していた
のでしょうか？
データを表示する為の表として作成しているでしたら、表の
中に表を作成する方法も、さらに絶対位置または相対位置
で好きな場所に移動して表示させる方法も、ちょっと無理す
ぎます。（＾-＾；A

必要なセルの数ははっきりしていると思いますので、結合
または分割を使用して、表を整えると良いです。
http://hpb.cool.ne.jp/hpbuilder/hyou.htm
http://www.sannet.ne.jp/userpage/lesson/begin/no14.html

デザインのレイアウト用として表を使用している場合で、
相対配置で上手く出来ない時は、内側の表の代わりに
divまたはpを使用してセルの代わりのボックスを作成
すると良いです。
どちらも幅と高さを指定できますし、boder（線）やマージン
(外側の余白)やパディング(内側の余白)も指定できます。
この場合でも、上記のページを確認して、列を必要な箇所
だけ結合しておくと良いように思います。

クラス名やID名をつけて、その箇所だけにスタイルを適用
させる方法は、以下の2つの項目を確認してください。

・名前を付けてスタイルを設定し、指定した個所に定義したスタイルを適用する
http://www.wsb.jp/hpb/css/a01_1.htm#05
※操作手順1.2.3.の詳細は、ページ上部で確認可能

・IDやclassのスタイルを適用する
http://www.wsb.jp/hpb/css/a01_1.htm#06
※おそらくHTMLタグにクラス名を追加する操作だと思います。

何回でもやり直せるように、エクスプローラで開いて、ファイル
をコピーして複製を作ってから作業すると良いです。

お礼

>データを表示する為の表として作成しているでしたら、表の
中に表を作成する方法も、さらに絶対位置または相対位置
で好きな場所に移動して表示させる方法も、ちょっと無理す
ぎます。

…そうだったんですね。初心者なので知りませんでした（笑）
いろいろ考えたのですが、身丈に合うようにシンプルな構造にすることにしました。
中の表を上揃え、左揃えにして、あとはマージンやパディングを細かく指定していったら、思い通りに近いレイアウトにできました。
丁寧なご返答、ほんとうにありがとうございました。URLも参考にさせていただきます。

回答No.1

liv2007

>外側の表を基準にして中の表の位置指定

それでは絶対配置の方法になってしまいます。
相対配置は、自分(その要素)が本来表示される位置を基準
にしています。

http://www.stylish-style.com/csstec/base/position.html
上記のページの説明がとても詳しいので、参考にしてください。

テーブルであれば、テーブルの幅とセルの幅を正しく指定しな
いと、内容の長さによって、内側のテーブルが本来表示される
位置も変化します。
左右の位置は幅を指定することで固定できますが、上下の
位置は高さを指定してもセルに入力された内容によって変化
するという不都合が…
これは仕様ですので、仕方ないですね。（＾-＾；
※一行目のセルなど、内側のテーブルを入れるセルの位置
によっては大丈夫のようです。(topとleftで指定した場合)

テーブルで実現できない場合は、divなどを使用するレイアウト
を試してみてください。

お礼

>それでは絶対配置の方法になってしまいます。
相対配置は、自分(その要素)が本来表示される位置を基準
にしています。

…そのようですね。本来表示されるところではなく、もう一つ（外側）表を基準に位置を決めたかったのですが、どうやら無理そうです（涙）
ただ、シンプルに中の表を上揃え、左揃えを指定して、細かな指定はマージン、パディングで調整してみたらいい感じのレイアウトになりましたので、この方向で進めていきたいと思います。
丁寧なご返答、ほんとうにありがとうございました。