Wrapping pre tag text in a div using css

When using pre tags in html to display code blocks it will ignore the div boundaries and not wrap the text by default. By adding some css for pre tags this can be accomplished as follows.

Hint: Another option is to use overflow:auto which will add scroll bars for the content.

pre, code{
	/*Wrap pre tag text for all popular browsers*/
	white-space: pre-wrap; 
	white-space: -moz-pre-wrap !important; 
	white-space: -pre-wrap; 
	white-space: -o-pre-wrap; 
	word-wrap: break-word; 
	/*Or use overflow:auto ----------- */
	/*overflow:auto;*/
}

Leave a Reply

Your email address will not be published. Required fields are marked *