テーブルタグ内の半角文字が隠れます。

質問

IE8で、テーブル内の半角テキストが折り返さずに隠れてしまいます。

他ブラウザでは、セルから飛び出します。
また、全角の場合は、自動的に折り返しています。

こういった現象というのは、何が原因となっているのでしょうか。
CSSかと思い、思い当たる節は変えたり試したのですが、分からなかったため、ご質問させていただきました。

ご存じの方いらっしゃいましたら、何卒ご教授お願い致します。

回答No.3

think49 · ベストアンサー

まずはCSS起因かを切り分けるためにCSSを全て削除してみてはどうでしょう？
overflow が関係している可能性はありますが、切り分けが先だと思います。
CSS起因なら overflow を全て削除してみましょう。少しずつ削除する場所を狭めて問題の記述を突き止めてみてください。
(勿論、作業前にバックアップを取っておく必要があります)

ちなみに長い単語が含まれる場合にゼロ幅スペース(Zero-width space)を使用する必要はありません。
そんな状況のために word-wrap や word-break があるのですから。
http://www.tagindex.com/kakolog/q3bbs/1201/1374.html

お礼

>>CSSを全て削除

この方法でやってみます!!
やはり、かなり組みたててたので、
今一度見直してみようと思います!!

ありがとうございました!!

回答No.2

ORUKA1951

Tableは、表ですから、内容をすべて表示するため、内容をすべて読み込んで整形することになっています。
　しかし、レンダリングを早くするために、あるいはサイズを固定することで決めることは出来ます。
11.3 視覚系ユーザエージェントによる表の整形 ( http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html401j/struct/tables.html#h-11.3 )

　しかし、半角英数字を使用する言語体系では単語の途中で折り返すことは原則禁じられています。
9.1 空白類 ( http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html401j/struct/text.html#h-9.1 )
　そのため、長い半角英数字が含まれるときは、折り返しても良い文字間に「０字幅スペース」を置くことで対処します。
例)
<div>
a&#x200B;b&#x200B;c&#x200B;d&#x200B;e&#x200B;f&#x200B;g&#x200B;h&#x200B;i&#x200B;j&#x200B;k&#x200B;l&#x200B;m&#x200B;n&#x200B;o&#x200B;p&#x200B;q&#x200B;r&#x200B;s&#x200B;t&#x200B;u
</div>

お礼

ご回答ありがとうございました!!

回答No.1

ORUKA1951

tableは表ですから、サイズは自動的に計算されることになっています。単語境界のある言語は、単語の途中で改行されません。単語境界のない言語は任意の場所で折り返されます。
　HTMLでは、はみ出したときの処理はユーザーエージェントに任せられています。
　CSSではデフォルトはvisibleなのですが、IEはhiddenになっているようですから、明確にoverflow:visibleと指定する必要があります。
【引用】＿＿＿＿＿＿＿＿＿＿＿＿ここから
11.1.1 Overflow: the 'overflow' property

'overflow'
　　Value:　　　　visible | hidden | scroll | auto | inherit
　　Initial:　　　visible
　　Applies to: 　block containers
　　Inherited: 　no
　　Percentages: N/A
　　Media:　　　 visual
　　Computed value: as specified
￣￣￣￣￣￣￣￣￣￣￣￣￣ここまで［Visual effects( http://www.w3.org/TR/CSS2/visufx.html )］より

　ですが、その前にセルの横幅を決めてしまうという間違いを直さないと・・

お礼

ご回答ありがとうございました!!

補足

すいません、

>>その前にセルの横幅を決めてしまうという間違いを直さないと・・

とは、横幅をwidthで指定してはいけないということなのでしょうか…？