diff --git a/css/comments.css b/css/comments.css
index 22975c0..a597c0b 100644
--- a/css/comments.css
+++ b/css/comments.css
@@ -61,7 +61,7 @@
   clear: both;
   list-style-type: none;
   overflow: hidden;
-  padding: 20px 0 10px;
+  padding: 20px 0 20px 0;
   position: relative;
 }
 .comment.author-comment:after {
@@ -79,12 +79,20 @@
 .comment.spam .comment-text {
   border: 1px dashed orange;
 }
+.comment img.gravatar {
+  float: left;
+  margin: 20px;
+  width: 90px;
+  height: 90px;
+  border: none;
+}
 .comment .comment-text {
   background-color: #fff;
   border: 1px solid #ddd;
   box-shadow: none;
   margin: 0;
-  padding: 0 15% 0 20px;
+  padding: 0 20px 0 20px;
+  min-height: 130px;
   white-space: pre;
   white-space: pre-wrap;
   white-space: pre-line;
@@ -93,6 +101,10 @@
 .comment .comment-text p:last-child {
   margin-bottom: 0;
 }
+.comment .comment-text.hasGravatar {
+  padding: 0 20px 0 130px;
+  min-height: 130px;
+}
 .comment .date {
   font-size: 16px;
 }
diff --git a/css/comments.css.map b/css/comments.css.map
index 296eb91..66d6ba4 100644
--- a/css/comments.css.map
+++ b/css/comments.css.map
@@ -1,6 +1,6 @@
 {
 "version": 3,
-"mappings": "AAAA,0BAA2B;EAC1B,KAAK,EAAE,IAAI;;AAEX,iCAAO;EACN,KAAK,EAAE,IAAI;;AAGZ;kCACQ;EACP,SAAS,EAAE,KAAK;;AAGjB,+BAAK;EACJ,KAAK,EAAE,IAAI;EACX,YAAY,EAAE,GAAG;;AAGlB,qCAAW;EACV,WAAW,EAAE,IAAI;EACjB,aAAa,EAAE,CAAC;;AAGjB,yCAAe;EACd,MAAM,EAAE,CAAC;;AAGV,yCAAe;EACd,MAAM,EAAE,MAAM;;AAIf,2CAAiB;EAChB,UAAU,EAAE,IAAI;;AAEhB,sDAAU;EACT,WAAW,EAAE,MAAM;;AAIrB,+CAAqB;EACpB,UAAU,EAAE,GAAG;EACf,UAAU,EAAE,KAAK;;AAEjB,6DAAc;EACb,MAAM,EAAE,WAAW;;AAEnB,gEAAG;EACF,OAAO,EAAE,MAAM;EACf,eAAe,EAAE,IAAI;EACrB,WAAW,EAAE,IAAI;;AAEjB,4EAAc;EACb,WAAW,EAAE,CAAC;;AAGf,qFAAuB;EACtB,KAAK,EAAE,KAAK;;AAId,+DAAE;EACD,gBAAgB,EAAE,IAAI;;AAEtB,6EAAgB;EACf,cAAc,EAAE,UAAU;;AAM9B,2CAAiB;EAChB,OAAO,EAAE,YAAY;EACrB,UAAU,EAAE,IAAI;;;AAKlB,QAAS;EACR,KAAK,EAAC,IAAI;EACV,eAAe,EAAE,IAAI;EACrB,QAAQ,EAAE,MAAM;EAChB,OAAO,EAAE,WAAW;EACpB,QAAQ,EAAE,QAAQ;;AAGjB,6BAAQ;EACP,OAAO,EAAE,QAAQ;EACjB,KAAK,EAAE,KAAK;EACZ,QAAQ,EAAE,QAAQ;EAClB,GAAG,EAAE,KAAK;EACV,KAAK,EAAE,KAAK;EACZ,SAAS,EAAE,GAAG;EACd,WAAW,EAAE,IAAI;;AAGlB,uCAAgB;EACf,MAAM,EAAE,cAAc;;AAMvB,2BAAc;EACb,MAAM,EAAE,iBAAiB;;AAI3B,sBAAc;EACb,gBAAgB,EAAE,IAAI;EACtB,MAAM,EAAE,cAAc;EACtB,UAAU,EAAE,IAAI;EAChB,MAAM,EAAE,CAAC;EACT,OAAO,EAAE,YAAY;EACrB,WAAW,EAAE,GAAG;EAChB,WAAW,EAAE,QAAQ;EACrB,WAAW,EAAE,QAAQ;EACrB,SAAS,EAAE,UAAU;;AAErB,mCAAa;EACZ,aAAa,EAAE,CAAC;;AAIlB,cAAM;EACL,SAAS,EAAE,IAAI;;AAEf,qBAAS;EACR,OAAO,EAAE,8BAA8B;;AAKxC,oCAAgB;EACf,MAAM,EAAE,gBAAgB;;AAI1B,cAAM;EACL,aAAa,EAAE,IAAI;;AAGpB,sBAAgB;EACf,MAAM,EAAE,iBAAiB;EACzB,aAAa,EAAE,GAAG;EAClB,OAAO,EAAE,aAAa;;AAGvB,mCAA2B;EAC1B,KAAK,EAAE,IAAI;EACX,YAAY,EAAE,IAAI;EAClB,MAAM,EAAE,UAAU;EAClB,WAAW,EAAE,eAAe;;AAE5B,8DAA2B;EAC1B,OAAO,EAAE,MAAM;;AAEhB,2DAAwB;EACvB,OAAO,EAAE,UAAU;;;AAKtB,yBAA0B;EACzB,WAAW,EAAE,CAAC;;;AAGf,mBAAoB;EACnB,KAAK,EAAE,KAAK;;;AAGb,2BAA4B;EAC3B,KAAK,EAAE,IAAI;;;AAGZ,qBAAsB;EACrB,MAAM,EAAE,WAAW;;AAEnB,wCAAmB;EAClB,YAAY,EAAE,IAAI;;;AAIpB,uBAAwB;EACvB,UAAU,EAAE,IAAI",
+"mappings": "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",
 "sources": ["../scss/comments.scss"],
 "names": [],
 "file": "comments.css"
diff --git a/scss/comments.scss b/scss/comments.scss
index 27d7280..a0d967e 100644
--- a/scss/comments.scss
+++ b/scss/comments.scss
@@ -1,185 +1,202 @@
-.comments-holder-container {
-	clear: both;
-
-	.field {
-		clear: left;
-	}
-
-	.num,
-	.author {
-		font-size: 1.3em;
-	}
-
-	.num {
-		color: #999;
-		margin-right: 5px;
-	}
-
-	.num-total {
-		line-height: 40px;
-		margin-bottom: 0;
-	}
-
-	.comments-list {
-		margin: 0;
-	}
-
-	.comment-count {
-		margin: 15px 0;
-	}
-
-	// The comment form
-	.commenting-area {
-		margin-top: 50px;
-
-		label.left{
-			font-weight: normal;
-		}
-	}
-
-	.commenting-rss-feed {
-		margin-top: 4em;
-		text-align: right;
-
-		.action-links {
-			margin: 20px 0 10px;
-
-			li {
-				display: inline;
-				list-style-type: none;
-				margin-left: 20px;
-
-				&:first-child {
-					margin-left: 0;
-				}
-
-				&.comment-reply-action {
-					float: right;
-				}
-			}
-
-			a {
-				background-image: none;
-
-				&::first-letter {
-					text-transform: capitalize;
-				}
-			}
-		}
-	}
-
-	.no-comments-yet {
-		display: inline-block;
-		margin-top: 10px;
-	}
-}
-
-// A published comment
-.comment {
-	clear:both;
-	list-style-type: none;
-	overflow: hidden;
-	padding: 20px 0 10px;
-	position: relative;
-
-	&.author-comment {
-		&:after {
-			content: 'Author';
-			float: right;
-			position: absolute;
-			top: 1.5em;
-			right: 0.5em;
-			font-size: 1em;
-			font-weight: bold;
-		}
-
-		> .comment-text {
-			border: 1px solid blue;
-		}
-
-	}
-
-	&.spam {
-		.comment-text {
-			border: 1px dashed orange;
-		}
-	}
-
-	.comment-text {
-		background-color: #fff;
-		border: 1px solid #ddd;
-		box-shadow: none;
-		margin: 0;
-		padding: 0 15% 0 20px;
-		white-space: pre;
-		white-space: pre-wrap;
-		white-space: pre-line;
-		word-wrap: break-word;
-
-		p:last-child {
-			margin-bottom: 0;
-		}
-	}
-
-	.date {
-		font-size: 16px;
-
-		&:before {
-			content: '\0000a0\0000a0\0000a0\0000a0';
-		}
-	}
-
-	&.unmoderated {
-		> .comment-text {
-			border: 1px solid yellow;
-		}
-	}
-
-	.info {
-		margin-bottom: 10px;
-	}
-
-	&.spam .comment {
-		border: 1px dashed orange;
-		border-radius: 4px;
-		padding: 2.5em 1em 1em;
-	}
-
-	.comment-replies-container {
-		clear: both;
-		padding-left: 10px;
-		margin: 80px 0 0 0;
-		border-left: 1px dashed #999;
-
-		.comment-reply-form-holder {
-			padding: 0 10px; // Prevent clipping issues on slideUp/Down
-		}
-		.comment-replies-holder {
-			padding: 0 0 0 10px;
-		}
-	}
-}
-
-.comments-list.root-level {
-	margin-left: 0;
-}
-
-.comment-reply-link {
-	float: right;
-}
-
-.comment-moderation-options {
-	float: left;
-}
-
-.comment-action-links {
-	margin: 20px 0 10px;
-
-	a:not(:last-child) {
-		margin-right: 12px;
-	}
-}
-
-.commenting-rss-feed ul {
-	list-style: none;
-}
+.comments-holder-container {
+	clear: both;
+
+	.field {
+		clear: left;
+	}
+
+	.num,
+	.author {
+		font-size: 1.3em;
+	}
+
+	.num {
+		color: #999;
+		margin-right: 5px;
+	}
+
+	.num-total {
+		line-height: 40px;
+		margin-bottom: 0;
+	}
+
+	.comments-list {
+		margin: 0;
+	}
+
+	.comment-count {
+		margin: 15px 0;
+	}
+
+	// The comment form
+	.commenting-area {
+		margin-top: 50px;
+
+		label.left{
+			font-weight: normal;
+		}
+	}
+
+	.commenting-rss-feed {
+		margin-top: 4em;
+		text-align: right;
+
+		.action-links {
+			margin: 20px 0 10px;
+
+			li {
+				display: inline;
+				list-style-type: none;
+				margin-left: 20px;
+
+				&:first-child {
+					margin-left: 0;
+				}
+
+				&.comment-reply-action {
+					float: right;
+				}
+			}
+
+			a {
+				background-image: none;
+
+				&::first-letter {
+					text-transform: capitalize;
+				}
+			}
+		}
+	}
+
+	.no-comments-yet {
+		display: inline-block;
+		margin-top: 10px;
+	}
+}
+
+// A published comment
+.comment {
+	clear:both;
+	list-style-type: none;
+	overflow: hidden;
+	padding: 20px 0 20px 0;
+	position: relative;
+
+	&.author-comment {
+		&:after {
+			content: 'Author';
+			float: right;
+			position: absolute;
+			top: 1.5em;
+			right: 0.5em;
+			font-size: 1em;
+			font-weight: bold;
+		}
+
+		> .comment-text {
+			border: 1px solid blue;
+		}
+
+	}
+
+	&.spam {
+		.comment-text {
+			border: 1px dashed orange;
+		}
+	}
+
+    img.gravatar {
+        float: left;
+        margin: 20px;
+        width: 90px;
+        height: 90px;
+        border: none;
+    }
+
+	.comment-text {
+		background-color: #fff;
+		border: 1px solid #ddd;
+		box-shadow: none;
+		margin: 0;
+		padding: 0 20px 0 20px;
+        min-height: 130px;
+		white-space: pre;
+		white-space: pre-wrap;
+		white-space: pre-line;
+		word-wrap: break-word;
+
+		p:last-child {
+			margin-bottom: 0;
+		}
+	}
+
+    .comment-text.hasGravatar {
+        // leave enough space on the left for the default gravatar size
+        padding: 0 20px 0 130px;
+
+        // Ensure there is enough vertical space for the Gravatar
+        min-height: 130px;
+    }
+
+	.date {
+		font-size: 16px;
+
+		&:before {
+			content: '\0000a0\0000a0\0000a0\0000a0';
+		}
+	}
+
+	&.unmoderated {
+		> .comment-text {
+			border: 1px solid yellow;
+		}
+	}
+
+	.info {
+		margin-bottom: 10px;
+	}
+
+	&.spam .comment {
+		border: 1px dashed orange;
+		border-radius: 4px;
+		padding: 2.5em 1em 1em;
+	}
+
+	.comment-replies-container {
+		clear: both;
+		padding-left: 10px;
+		margin: 80px 0 0 0;
+		border-left: 1px dashed #999;
+
+		.comment-reply-form-holder {
+			padding: 0 10px; // Prevent clipping issues on slideUp/Down
+		}
+		.comment-replies-holder {
+			padding: 0 0 0 10px;
+		}
+	}
+}
+
+.comments-list.root-level {
+	margin-left: 0;
+}
+
+.comment-reply-link {
+	float: right;
+}
+
+.comment-moderation-options {
+	float: left;
+}
+
+.comment-action-links {
+	margin: 20px 0 10px;
+
+	a:not(:last-child) {
+		margin-right: 12px;
+	}
+}
+
+.commenting-rss-feed ul {
+	list-style: none;
+}
diff --git a/templates/CommentsInterface_singlecomment.ss b/templates/CommentsInterface_singlecomment.ss
index 47a16d1..7182bca 100755
--- a/templates/CommentsInterface_singlecomment.ss
+++ b/templates/CommentsInterface_singlecomment.ss
@@ -6,13 +6,12 @@
 			<span class="author">$AuthorName.XML</span>
 		<% end_if %>
 		<span class="date">$Created.Nice ($Created.Ago)</span>
-		<% if $Gravatar %>
-			<img class="gravatar" src="$Gravatar.ATT" alt="Gravatar for $Name.ATT" title="Gravatar for $Name.ATT" />
-		<% end_if %>
 	</p>
 <% end_if %>
-
-<div class="comment-text" id="<% if $isPreview %>comment-preview<% end_if %>">
+<% if $Gravatar %>
+    <img class="gravatar" src="$Gravatar.ATT" alt="Gravatar for $Name.ATT" title="Gravatar for $Name.ATT" />
+<% end_if %>
+<div class="comment-text<% if $Gravatar %> hasGravatar<% end_if %>" id="<% if $isPreview %>comment-preview<% else %>$Permalink<% end_if %>">
 	<p>$EscapedComment</p>
 </div>