title: Why is paragraph tag overflowing instead of creating a new line?
body: <p>Whenever I create a P tag and fill it with code it overflows instead of creating new lines.
  CSS:</p>
  
  <pre><code>#main {
  width: 700px;
  margin-right: auto;
  margin-left: auto;
  font-family: Arial, Helvetica, sans-serif;
  }
  #main #top h1 {
      text-align: center;
      font-size: 48px;
      margin: 0;
  }
  #main #menucontainer  {
      width: 700px;
      border: 1px solid black;
  }
  #main #menucontainer ul {
      list-style-type: none;
      margin: 0 auto;
      padding: 0px;
      width: 255px;
  }
  #main #menucontainer ul li a {
      font-size: 18px;
      text-decoration: none;
      color: #000;
      display: block;
      padding: 5px 10px;
      text-align: center;
      float: left;
      border-left-width: 1px;
      border-left-style: solid;
      border-left-color: #000;
  }
  #main #menucontainer ul li a:hover {
      background-color: black;
      color: white;
  }
  #main #menucontainer ul li a.current {
      background-color:#CCC;
      color: black;
  }
  
  
  #main #footer {
      margin-top: 10px;
      text-align: center;
      font-style:italic;
  }
  </code></pre>
  
  <p>HTML:</p>
  
  <pre><code>&lt;html xmlns="http://www.w3.org/1999/xhtml"&gt;
  
  &lt;head&gt;
  
  &lt;meta http-equiv="Content-Type" content="text/html; charset=utf-8" /&gt;
  
  &lt;title&gt;Home&lt;/title&gt;
  
  &lt;link href="styles.css" rel="stylesheet" type="text/css" /&gt;
  
  &lt;/head&gt;
  
  &lt;body&gt;
  
  &lt;div id="main"&gt;
  
  &lt;div id="top"&gt;
  
  &lt;h1&gt;Home&lt;/h1&gt;
  
  &lt;/div&gt;
  
  &lt;div id="menucontainer"&gt;
  
  &lt;ul&gt;
  
  &lt;li&gt;&lt;a href="index.php" class="current"&gt;Home&lt;/a&gt;&lt;/li&gt;
  
  &lt;li&gt;&lt;a href="submit.php"&gt;Submit&lt;/a&gt;&lt;/li&gt;
  
  &lt;li&gt;&lt;a href="contactus.php" style="border-right:solid 1px black;"&gt;Contact Us&lt;/a&gt;&lt;/li&gt;
  
  &lt;/ul&gt;
  
  &lt;div style="clear:both;"&gt;&lt;/div&gt;
  
  &lt;/div&gt;
  
  &lt;p&gt;asdfhsadfkjasdjkcnakdsjnfkjdsanckjdsanfjkhaskjcnjksdankjfhasdknjcnadsjkfhkjsdhfkjncjsdnfjaksdhfkjadshfjkcndasjknf&lt;/p&gt;
  
  &lt;div id="footer"&gt;2011&lt;/div&gt;
  
  &lt;/div&gt;
  
  &lt;/body&gt;
  
  &lt;/html&gt;
  </code></pre>