[CSS]半角英数数字が改行されずに要素からはみ出る問題を回避する方法

CSSスニペット

2011.01.06

要素からはみ出る例
1. デモ
要素からはみ出る問題を回避（table以外）
1. デモ
補足

要素からはみ出る例

<div class="parent">
  <p class="no-break">1234567890abcdefg1234567890abcdefg1234567890abcdefg1234567890abcdefg1234567890abcdefg1234567890abcdefg1234567890abcdefg</p>
</div>

<p class="no-break">1234567890abcdefg1234567890abcdefg1234567890abcdefg1234567890abcdefg1234567890abcdefg1234567890abcdefg1234567890abcdefg</p>

</div>

デモ

1234567890abcdefg1234567890abcdefg1234567890abcdefg1234567890abcdefg1234567890abcdefg1234567890abcdefg1234567890abcdefg

要素からはみ出る問題を回避（table以外）

<style type="text/css">
.parent {
	width: 500px
}

.break {
	word-wrap: break-word
}
</style>

<div class="parent">
  <p class="break">1234567890abcdefg1234567890abcdefg1234567890abcdefg1234567890abcdefg1234567890abcdefg1234567890abcdefg1234567890abcdefg</p>
</div>