diff --git a/html/commit.html b/html/commit.html
index 01ddaea..0aef794 100644
--- a/html/commit.html
+++ b/html/commit.html
@@ -27,5 +27,5 @@
 	</table>
 	<hr>
 	<div id="message"></div>
-	<pre><div id="details"></div></pre>
+	<pre><code id="details"></code></pre>
 </body>
\ No newline at end of file
diff --git a/html/commit.js b/html/commit.js
index 2a8ba66..ad08c97 100644
--- a/html/commit.js
+++ b/html/commit.js
@@ -1,21 +1,29 @@
 var Commit = Class.create({
 	initialize: function(obj) {
 		this.raw = obj.details();
-		this.sha = this.raw.match(/^commit ([0-9a-f]{40,40})/)[1];
+		var messageStart = this.raw.indexOf("\n\n") + 2;
+		var diffStart = this.raw.indexOf("\ndiff ");
 
-		var match = this.raw.match(/\nauthor (.*) <(.*@.*)> ([0-9].*)/);
+		this.header = this.raw.substring(0, messageStart);
+
+		this.sha = this.header.match(/^commit ([0-9a-f]{40,40})/)[1];
+
+		var match = this.header.match(/\nauthor (.*) <(.*@.*)> ([0-9].*)/);
 		this.author_name = match[1];
 		this.author_email = match[2];
 		this.author_date = new Date(parseInt(match[3]) * 1000);
 
-		match = this.raw.match(/\ncommitter (.*) <(.*@.*)> ([0-9].*)/);
+		match = this.header.match(/\ncommitter (.*) <(.*@.*)> ([0-9].*)/);
 		this.committer_name = match[1];
 		this.committer_email = match[2];
 		this.committer_date = new Date(parseInt(match[3]) * 1000);
 
-		this.parents = $A(this.raw.match(/\nparent ([0-9a-f]{40,40})/g)).map(function(x) {
+		this.parents = $A(this.header.match(/\nparent ([0-9a-f]{40,40})/g)).map(function(x) {
 			return x.replace("\nparent ",""); 
 		});
+
+		this.message = this.raw.substring(messageStart, diffStart);
+		this.diff = this.raw.substring(diffStart);
 	},	
 });
 
@@ -35,15 +43,10 @@ var doeHet = function() {
 		new_row.innerHTML = "<td class='property_name'>Parent:</td><td><a href=''>" + parent + "</a></td>";
 	});
 
-	details = CommitObject.details();
-	messageStart = details.indexOf("\n\n") + 2;
-	diffStart = details.indexOf("diff");
-	
-	header  = details.substring(0, messageStart);
-	message = details.substring(messageStart, diffStart);
-	details = details.substring(diffStart);
-	
-	
-	$("message").innerHTML = message.replace(/\n/g,"<br>");
-	$("details").innerHTML = details;
+	$("message").innerHTML = commit.message.replace(/\n/g,"<br>");
+	if (commit.diff.length < 1000) {
+		$("details").innerHTML = commit.diff;
+	} else {
+		$("details").innerHTML = "This diff is currently too large to watch in detailed mode";
+	}
 }
diff --git a/html/commits.css b/html/commits.css
index bd757fa..af39c72 100644
--- a/html/commits.css
+++ b/html/commits.css
@@ -5,7 +5,7 @@
 }
 .property_name {
 	width: 50px;
-	color:#999;
+	color:#7F7F7F;
 	text-align: right;
 	font-weight: bold;
 }
@@ -17,7 +17,7 @@
 #details {
 	font-family: Monaco;
 	font-size: 10px;
-	overflow: none;
+	overflow: hidden;
 	width: 600px;
 }
 hr {
@@ -25,4 +25,13 @@ hr {
 	height: 1px;
 	width: 80%;
 	background-color: #999;
-}
\ No newline at end of file
+}
+
+pre {
+  overflow-y: auto;
+}
+
+pre code {
+  display: table-cell;
+  width: 100%;
+}