css - リキッドレイアウトを使用するとテキストが重なる

Question

この重複の可能性は役に立ちませんでした

私のコードは非常に単純です ->私のコード、Plunker

テキストが重ならないようにし、サイドバーのパーセンテージを 7%、コンテンツを 90% に維持したいと考えています。
レイアウトをLiquidに保ちながら、どうすればそれを行うことができますか?

Answer 1

サイドバー内のコンテンツは大きく 2 つあり、コンテナの境界を超えています。サイドバーに overflow:hidden を追加すると、リスト アイテムの箇条書きだけが表示されることがわかります。

UL の余白はすべてを外側に押し出し、単語は 7% 幅の画面サイズに収まりません。word-break:break-all; を使用できます。css3 ルールですが、一部のブラウザーでは機能しませんhttp://caniuse.com/#search=word-break

.sidebar ul{
  width:100%;
  margin:0;
  padding:0;
  overflow:hidden;
  word-break:break-all;
}