テキストをボーダーで囲むCSS

質問

CSSを本を見ながらやっていますが、
下記の例文でテキストをボーダーで囲むものをやってみました。
この中で、
margin-left:100px;
margin-right:100px;
というころですが、これはブラウザに対しての両サイド空きを意味していると思うのですが、逆に囲んでいる幅のほうを指定するにはどうしたらよいのでしょうか。

または、そのようなことはできないのでしょうか。

<STYLE TYPE="text/css">

<!--
P.text {text-align:justify;
text-justify:distribute;
line-height:154%;
margin-left:100px;
margin-right:100px;
border-style:solid;
border-width:2px;
border-color:#dd8888;
padding:10px}

--></STYLE>

*****HTML
<P CLASS="text">
テーブルみたいになるテキスト</P>

回答No.2

peso · ベストアンサー

そのものの幅を指定するときは width を使います。

width:400px;

ただし、margin 関係を設定するとその分寄ってしまいます。
余白を持たせたい場合は padding を使ってください。

お礼

何度もありがとうございます。
よくわかりました！

回答No.1

peso

＞囲んでいる幅のほうを指定

これは線の太さでしょうか？線と文字との間の空白のことでしょうか？
線の太さは
　border-○○-width で、
線と文字との間の空白は
　padding-○○
で指定します。○○には　top　right　bottom　left　のどれかが入ります。
なので、例えば

border-left-width:100px;
padding-right:100px;

などのような使い方をします。
４辺すべてを同じ幅にするには

border-width:10px;
padding:10px;

などのように指定します。
あるいはいっぺんに指定する方法で

border-width: top right bottom left;

なども可能です。
実際には数値と単位を指定します。

border-width:10px 20px 30px 40px;

補足

ありがとうございます。
お聞きしたいのが、
HTMLでいうところの「テーブルの幅」です。

私の記述だと、ブラウザに対して四角の横幅が広がってしまうのですが、
解像度に依存しないよう、例えば400pxで固定したいのですが、
どうでしょうか。。