文字が隠れる問題の解決方法とは？

質問

• 『※』の部分に文字などもなく不自然にスペースができています。『めいん』の幅以上の文字を入れると、文字が隠れてしまいます。
• 『※』の部分まで『めいん』を伸ばし、2カラムにしたいのですが、他所の幅を変更するだけでは解決できず、質問をさせていただきました。
• 質問部分のコードは下記の通りです。

回答No.3

ORUKA1951

いいや、サイトナビゲーションを左にと言われるならスタイルシートの最後に
div.header{position:relative;}
div.header div.nav{
width:20%;
position:absolute;
top:100%;
z-index:10;
}
div.section h2{margin-top:20px;}
#contentTable{width:78%;margin-left:20%;height:auto;height:20px;}
#contentTable ol,#contentTable ol li{margin:0;padding:0;text-align:center;}
#contentTable ol li{display:inline-block;}

を付け加える。

　文書構造さえ、きちんと正しく書かれていれば、どのようにもデザインできます。デザインとは所詮内容に見合ったものになるのですからね。
1) まずデザインを切り離してHTMLを書く練習をすること。
　　そうするととても楽でしょう。
2) スタイルシートはHTMLの文書構造を利用して書く。デザインのためにHTMLを書くのではない!!
　　そうすれば、HTMLに変なclass/id名を書かなくて済むので、後々もとても楽
div.section h2
　とは「classにsectionの値を持つdiv要素の子孫のh2」という意味です。HTML開かなくても、何をしようとしているか判る。

お礼

ごめんなさい。ありがとうございます。