CSSの外部シート（テーブル幅）について

質問

CSSで困っております
どうぞよろしくお願いいたします。

上下するテーブルの幅を合わせたいのですが
合いません

ここに書くと読みにくいので
質問の内容と
実際のモノを図説しました
http://yamachan.daiwa-hotcom.com/2.html

どうぞよろしくお願いいたします。

回答No.1

abril · ベストアンサー

もしもオリジナルのソースがコピペの通りだとしたら、下記の各セレクタの"width:200px;"の指定の前に全角スペースが一つ入ってしまっています。

#bar_base {border:0px solid #000000;
　width:200px;
}
#service {border:1px solid #ff0000;
　width:200px;
}

その為、両者とも"width:200px;"の指定が無効の状態になっていますので、各tableの幅は内包するデータに依存する事になります。したがって、#serviceのtableの方は一番長いテキスト分の幅にしかなりません。#bar_baseの方が200pxの幅に結果としてなっているのは、中の画像の幅が200pxあるからです。

ということで、CSSのソースから全角スペースを除去すれば意図通りの結果になります。ここの質問をみていると、結構HTMLやCSSのソースで全角スペースが紛れている事に気づかず、うまくいかないと四苦八苦しているケースが多い様です。HTMLエディタで全角スペースを視認できる設定にしておいた方が間違いを防げるでしょう。

お礼

おー
いけましたｗ
http://yamachan.daiwa-hotcom.com/2.html

確かに半角で途中までしてたのですが
半角を4回押しているうちに
面倒だし全角でいいや」とやっておりました

こういう事が発生するのですね
勉強になりました

ありがとうございました
助かりました^^

回答No.2

abril

No.1です。
追記ですみませんが、本件のCSSファイルの残りの部分中、下記の各プロパティの指定の前にも「半角・半角・全角」という状態で全角スペースが入ってます。
これらの指定も無効になっている筈ですので、チェック＆修正された方がよろしいでしょう。また、スペースよりタブの方がこういう間違いの心配がないので、どちらかというとインデントにはタブをお勧めします。

.contents{
（省略）
　border:0px solid #000000;
（省略）
}
.leftmenu {
　float:left;
　width:200px;
　padding:0 0 10px 0px;
}