Bootstrap wrapping word inside grid?

HTML & CSS
1

Hi guys

I’m trying to experiment the grid system of bootstrap.
I want to try how to wrap words inside it.

Here are the codes,


<!DOCTYPE html>
<html>
  <head>
    <title>Grid System</title>
    <!-- Bootstrap -->
    <link href="css/bootstrap.min.css" rel="stylesheet" media="screen">
  </head>


  <body>
    <h1>Grid Demo!</h1>
	
	<div class="row">
	  <div class="span4">span4span4span4span4span4</div>
	  <div class="span8">span8span8span8span8span8span8span8span8span8span</div>
	</div>	
	<div class="row">
	  <div class="span6">
		<h2>Hello kitty.</h2>
			<p>span6span6span6span6span6span6span6span6span6span6span6span6span6span6span6span6span6span6span6span6span6span6span6span6span6span6span6span6span6span6span6span6span6span6span6span6span6span6span6span6span6span6span6span6span6span6span6span6</p>
	  </div>
	  <div class="span6">span6span6span6span6span6span6</div>
	</div>		
	<div class="row">
	  <div class="span12">span12span12span12span12span12span12span12span12span12span12span12span12span12span12</div>
	</div>	
	
    <script src="http://code.jquery.com/jquery-latest.js"></script>
    <script src="js/bootstrap.min.js"></script>
  </body>
</html>

But unfortunately it doesn’t auto wrap?
How to wrap the sentences/words when it reaches the end of the span/row ?

Thanks in advanced.

2

What happens if you put spaces between the words?

3

I will try that LOL :slight_smile:

4

Or, if you must have them thar long words, you can use:

p {word-wrap:break-word;}