WEB作成関連です。
下はまったく同じスタイル指定のtableタグ(<table style="width:20%;border:1px solid purple;word-break: break-all;word-wrap: break-word;">~</table>)の中に別種の文字を入れているだけなのですが、IEだと全角記号の連続を含むテーブル②は自動改行されません。同じブロック要素でもdivタグならIEであっても全角記号の連続に対しword-wrapの指定が効くようですが※1、なぜかIEとtableタグおよび全角記号の組み合わせでは効かないようです。
tdタグ内に絶対幅指定したdivタグを入れ子にして何とかするということもできるのかもしれないけど、私が本来やりたいのは特に幅の指定をしない柔軟なtable内で、ブラウザの横スクロールバーが出ないよう、(全角記号の連続を含む)長い行だけを折り曲げることなわけです。これは、HTMLとCSSの範囲内では、見るブラウザを変える以外、救済の方法が存在しないような気がします。こういうの、たいてい何らかの代替策があるもんだけどなぁ...。
ネット上にこの組み合わせでの情報があんまり見当たらず、他にも躓いている人がいるかもしれないと思ったので、とりあえずメモとして書いておきます。
テーブル①
あいうえおかきくけこさしすせそたちつてとなにぬねのはひふへほまみむめもやゆよらりるれろわをんABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789!"#$%&'()/-+`{+*}<>?_ |
テーブル②
!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!! |
※1:【HTML・CSS】 文章の一部、文字が領域を突き抜けてしまうのを検証してみた
コメントする