テーブルを使わない分割方法・・・2分割にする 



スタイルシートを使うとテーブルを使わなくてもページの分割ができます。
実施例
この文章は float:left; width:48%; の指示をすることにより、左側に表示されるように書いています。全体の48%の幅で 左に寄って表示されています。真中より少し左よりになります。
この文章は margin-left:52%; の指示をすることにより、左に52%のスペースを空けるように書いています。 この空きスペースには全体の48%幅で最初の文章が表示されていますので、中央部に4%分の空白が入ることになります。

float:left; width:数値;  と  margin-left:数値;を使う
上の実施例は次のような表記になっています。
記入例-1
<DIV style=" width: 48%; float:left;"> この文章は float:left; width:48%; の指示をすることにより、左側に表示されるように書いています。全体の48%の幅で 左に寄って表示されています。真中より少し左よりになります。 </DIV>
<DIV style=" margin-left:52%;"> この文章は margin-left:52%; の指示をすることにより、左に52%のスペースを空けるように書いています。 この空きスペースには全体の48%幅で最初の文章が表示されていますので、中央部に4%分の空白が入ることになります。 </DIV>

記入例-2
HEADタグの間に次の指定をします
<Style type="text/css">
<!--
.left{width: 48%; float:left; }
.right{ margin-left:52%;}
-->
</STYLE>
そして本文を次のように書きます
<DIV class=" left"> この文章は float:left; width:48%; の指示をすることにより、左側に表示されるように書いています。全体の48%の幅で 左に寄って表示されています。真中より少し左よりになります。 </DIV>
<DIV class=" right"> この文章は margin-left:52%; の指示をすることにより、左に52%のスペースを空けるように書いています。 この空きスペースには全体の48%幅で最初の文章が表示されていますので、中央部に4%分の空白が入ることになります。 </DIV>

TOPページに戻る