From 70f9d4a54adc2396cd5c8d480d720d42023259b1 Mon Sep 17 00:00:00 2001
From: Cesar G <prototech91@gmail.com>
Date: Sun, 25 May 2014 04:30:46 -0700
Subject: [PATCH] [ticket/12155] Move icon class directly to <a> and use <span>
 consistently.

PHPBB3-12155
---
 phpBB/styles/prosilver/template/mcp_post.html |  6 +-
 .../styles/prosilver/template/mcp_topic.html  |  4 +-
 .../template/posting_topic_review.html        |  8 +-
 .../prosilver/template/ucp_pm_history.html    |  4 +-
 .../template/ucp_pm_message_header.html       | 32 +++-----
 .../template/ucp_pm_viewmessage.html          | 16 +++-
 .../prosilver/template/viewforum_body.html    | 16 ++--
 .../prosilver/template/viewtopic_body.html    | 40 +++++-----
 phpBB/styles/prosilver/theme/buttons.css      | 75 +++++++++++--------
 phpBB/styles/prosilver/theme/colours.css      |  6 +-
 10 files changed, 106 insertions(+), 101 deletions(-)

diff --git a/phpBB/styles/prosilver/template/mcp_post.html b/phpBB/styles/prosilver/template/mcp_post.html
index 49aa00de1c..d679fd1598 100644
--- a/phpBB/styles/prosilver/template/mcp_post.html
+++ b/phpBB/styles/prosilver/template/mcp_post.html
@@ -57,7 +57,11 @@
 				</a>
 			</li>
 			<!-- IF U_EDIT -->
-				<li class="edit-icon"><a href="{U_EDIT}" title="{L_EDIT_POST}" class="button icon-button"><span>{L_EDIT_POST}</span></a></li>
+				<li>
+					<a href="{U_EDIT}" title="{L_EDIT_POST}" class="button icon-button edit-icon">
+						<span>{L_EDIT_POST}</span>
+					</a>
+				</li>
 			<!-- ENDIF -->
 		</ul>
 
diff --git a/phpBB/styles/prosilver/template/mcp_topic.html b/phpBB/styles/prosilver/template/mcp_topic.html
index f7c3656ef4..19ee123eba 100644
--- a/phpBB/styles/prosilver/template/mcp_topic.html
+++ b/phpBB/styles/prosilver/template/mcp_topic.html
@@ -97,8 +97,8 @@
 
 			<div class="postbody" id="pr{postrow.POST_ID}">
 				<ul class="post-buttons">
-					<li class="info-icon">
-						<a href="{postrow.U_POST_DETAILS}" title="{L_POST_DETAILS}" class="button icon-button">
+					<li>
+						<a href="{postrow.U_POST_DETAILS}" title="{L_POST_DETAILS}" class="button icon-button info-icon">
 							<span>{L_POST_DETAILS}</span>
 						</a>
 					</li>
diff --git a/phpBB/styles/prosilver/template/posting_topic_review.html b/phpBB/styles/prosilver/template/posting_topic_review.html
index 1af6e08c18..6909877196 100644
--- a/phpBB/styles/prosilver/template/posting_topic_review.html
+++ b/phpBB/styles/prosilver/template/posting_topic_review.html
@@ -27,15 +27,15 @@
 			<!-- IF (topic_review_row.POSTER_QUOTE and topic_review_row.DECODED_MESSAGE) or topic_review_row.U_MCP_DETAILS -->
 			<ul class="post-buttons">
 			<!-- IF topic_review_row.U_MCP_DETAILS -->
-				<li class="info-icon">
-					<a href="{topic_review_row.U_MCP_DETAILS}" title="{L_POST_DETAILS}" class="button icon-button">
+				<li>
+					<a href="{topic_review_row.U_MCP_DETAILS}" title="{L_POST_DETAILS}" class="button icon-button info-icon">
 						<span>{L_POST_DETAILS}</span>
 					</a>
 				<li>
 			<!-- ENDIF -->
 			<!-- IF topic_review_row.POSTER_QUOTE and topic_review_row.DECODED_MESSAGE -->
-				<li class="quote-icon">
-					<a href="#postingbox" onclick="addquote({topic_review_row.POST_ID}, '{topic_review_row.POSTER_QUOTE}', '{LA_WROTE}');" title="{L_QUOTE} {topic_review_row.POST_AUTHOR}" class="button icon-button">
+				<li>
+					<a href="#postingbox" onclick="addquote({topic_review_row.POST_ID}, '{topic_review_row.POSTER_QUOTE}', '{LA_WROTE}');" title="{L_QUOTE} {topic_review_row.POST_AUTHOR}" class="button icon-button quote-icon">
 						<span>{L_QUOTE} {topic_review_row.POST_AUTHOR}</span>
 					</a>
 				</li>
diff --git a/phpBB/styles/prosilver/template/ucp_pm_history.html b/phpBB/styles/prosilver/template/ucp_pm_history.html
index c499242280..0e9c3844cc 100644
--- a/phpBB/styles/prosilver/template/ucp_pm_history.html
+++ b/phpBB/styles/prosilver/template/ucp_pm_history.html
@@ -19,8 +19,8 @@
 
 			<!-- IF history_row.U_QUOTE or history_row.MESSAGE_AUTHOR_QUOTE -->
 			<ul class="post-buttons">
-				<li class="quote-icon">
-					<a <!-- IF history_row.U_QUOTE -->href="{history_row.U_QUOTE}"<!-- ELSE -->href="#postingbox" onclick="addquote({history_row.MSG_ID}, '{history_row.MESSAGE_AUTHOR_QUOTE}', '{LA_WROTE}');"<!-- ENDIF --> title="{L_QUOTE} {history_row.MESSAGE_AUTHOR}" class="button icon-button">
+				<li>
+					<a <!-- IF history_row.U_QUOTE -->href="{history_row.U_QUOTE}"<!-- ELSE -->href="#postingbox" onclick="addquote({history_row.MSG_ID}, '{history_row.MESSAGE_AUTHOR_QUOTE}', '{LA_WROTE}');"<!-- ENDIF --> title="{L_QUOTE} {history_row.MESSAGE_AUTHOR}" class="button icon-button quote-icon">
 						<span>{L_QUOTE} {history_row.MESSAGE_AUTHOR}</span>
 					</a>
 				</li>
diff --git a/phpBB/styles/prosilver/template/ucp_pm_message_header.html b/phpBB/styles/prosilver/template/ucp_pm_message_header.html
index 4c0a0d69b6..040b75f6ad 100644
--- a/phpBB/styles/prosilver/template/ucp_pm_message_header.html
+++ b/phpBB/styles/prosilver/template/ucp_pm_message_header.html
@@ -9,31 +9,23 @@
 	<!-- IF U_POST_REPLY_PM or U_POST_NEW_TOPIC or U_FORWARD_PM -->
 		<div class="buttons">
 			<!-- IF U_POST_REPLY_PM -->
-				<div class="pmreply-icon">
-					<a title="{L_POST_REPLY_PM}" href="{U_POST_REPLY_PM}" class="button icon-button">
-						<span></span>{L_BUTTON_PM_REPLY}
-					</a>
-				</div>
+				<a title="{L_POST_REPLY_PM}" href="{U_POST_REPLY_PM}" class="button icon-button pmreply-icon">
+					<span>{L_BUTTON_PM_REPLY}</span>
+				</a>
 			<!-- ELSEIF U_POST_NEW_TOPIC -->
-				<div class="newpm-icon">
-					<a href="{U_POST_NEW_TOPIC}" accesskey="n" title="{L_UCP_PM_COMPOSE}" class="button icon-button">
-						<span></span>{L_BUTTON_PM_NEW}
-					</a>
-				</div>
+				<a href="{U_POST_NEW_TOPIC}" accesskey="n" title="{L_UCP_PM_COMPOSE}" class="button icon-button newpm-icon">
+					<span>{L_BUTTON_PM_NEW}</span>
+				</a>
 			<!-- ENDIF -->
 			<!-- IF U_FORWARD_PM -->
-				<div class="forwardpm-icon">
-					<a title="{L_POST_FORWARD_PM}" href="{U_FORWARD_PM}" class="button icon-button">
-						<span></span>{L_BUTTON_PM_FORWARD}
-					</a>
-				</div>
+				<a title="{L_POST_FORWARD_PM}" href="{U_FORWARD_PM}" class="button icon-button forwardpm-icon">
+					<span>{L_BUTTON_PM_FORWARD}</span>
+				</a>
 			<!-- ENDIF -->
 			<!-- IF U_POST_REPLY_PM and S_PM_RECIPIENTS gt 1 -->
-				<div class="reply-all">
-					<a title="{L_REPLY_TO_ALL}" href="{U_POST_REPLY_ALL}" class="button icon-button">
-						<span></span>{L_BUTTON_PM_REPLY_ALL}
-					</a>
-				</div>
+				<a title="{L_REPLY_TO_ALL}" href="{U_POST_REPLY_ALL}" class="button icon-button reply-all">
+					<span>{L_BUTTON_PM_REPLY_ALL}</span>
+				</a>
 			<!-- ENDIF -->
 		</div>
 	<!-- ENDIF -->
diff --git a/phpBB/styles/prosilver/template/ucp_pm_viewmessage.html b/phpBB/styles/prosilver/template/ucp_pm_viewmessage.html
index e75952d343..84ab6ecb44 100644
--- a/phpBB/styles/prosilver/template/ucp_pm_viewmessage.html
+++ b/phpBB/styles/prosilver/template/ucp_pm_viewmessage.html
@@ -68,16 +68,24 @@
 		<!-- IF U_DELETE or U_EDIT or U_QUOTE or U_REPORT -->
 		<ul class="post-buttons">
 			<!-- IF U_EDIT -->
-				<li class="edit-icon"><a href="{U_EDIT}" title="{L_POST_EDIT_PM}" class="button icon-button"><span>{L_POST_EDIT_PM}</span></a></li>
+				<li>
+					<a href="{U_EDIT}" title="{L_POST_EDIT_PM}" class="button icon-button edit-icon"><span>{L_POST_EDIT_PM}</span></a>
+				</li>
 			<!-- ENDIF -->
 			<!-- IF U_DELETE -->
-				<li class="delete-icon"><a href="{U_DELETE}" title="{L_DELETE_MESSAGE}" class="button icon-button"><span>{L_DELETE_MESSAGE}</span></a></li>
+				<li>
+					<a href="{U_DELETE}" title="{L_DELETE_MESSAGE}" class="button icon-button delete-icon"><span>{L_DELETE_MESSAGE}</span></a>
+				</li>
 			<!-- ENDIF -->
 			<!-- IF U_REPORT -->
-				<li class="report-icon"><a href="{U_REPORT}" title="{L_REPORT_PM}" class="button icon-button"><span>{L_REPORT_PM}</span></a></li>
+				<li>
+					<a href="{U_REPORT}" title="{L_REPORT_PM}" class="button icon-button report-icon"><span>{L_REPORT_PM}</span></a>
+				</li>
 			<!-- ENDIF -->
 			<!-- IF U_QUOTE -->
-				<li class="quote-icon"><a href="{U_QUOTE}" title="{L_POST_QUOTE_PM}" class="button icon-button"><span>{L_POST_QUOTE_PM}</span></a></li>
+				<li>
+					<a href="{U_QUOTE}" title="{L_POST_QUOTE_PM}" class="button icon-button quote-icon"><span>{L_POST_QUOTE_PM}</span></a>
+				</li>
 			<!-- ENDIF -->
 		</ul>
 		<!-- ENDIF -->
diff --git a/phpBB/styles/prosilver/template/viewforum_body.html b/phpBB/styles/prosilver/template/viewforum_body.html
index 46026f5464..ad2222b4e6 100644
--- a/phpBB/styles/prosilver/template/viewforum_body.html
+++ b/phpBB/styles/prosilver/template/viewforum_body.html
@@ -39,11 +39,9 @@
 
 	<!-- IF not S_IS_BOT and S_DISPLAY_POST_INFO -->
 		<div class="buttons">
-			<div class="<!-- IF S_IS_LOCKED -->locked-icon<!-- ELSE -->post-icon<!-- ENDIF -->" title="<!-- IF S_IS_LOCKED -->{L_FORUM_LOCKED}<!-- ELSE -->{L_POST_TOPIC}<!-- ENDIF -->">
-				<a href="{U_POST_NEW_TOPIC}" class="button icon-button">
-					<span></span><!-- IF S_IS_LOCKED -->{L_BUTTON_FORUM_LOCKED}<!-- ELSE -->{L_BUTTON_NEW_TOPIC}<!-- ENDIF -->
-				</a>
-			</div>
+			<a href="{U_POST_NEW_TOPIC}" class="button icon-button <!-- IF S_IS_LOCKED -->locked-icon<!-- ELSE -->post-icon<!-- ENDIF -->" title="<!-- IF S_IS_LOCKED -->{L_FORUM_LOCKED}<!-- ELSE -->{L_POST_TOPIC}<!-- ENDIF -->">
+				<span><!-- IF S_IS_LOCKED -->{L_BUTTON_FORUM_LOCKED}<!-- ELSE -->{L_BUTTON_NEW_TOPIC}<!-- ENDIF --></span>
+			</a>
 		</div>
 	<!-- ENDIF -->
 
@@ -226,13 +224,11 @@
 <!-- IF .topicrow and not S_DISPLAY_ACTIVE -->
 	<div class="topic-actions">
 		<!-- IF not S_IS_BOT and S_DISPLAY_POST_INFO -->
-		<div class="buttons">
-			<div class="<!-- IF S_IS_LOCKED -->locked-icon<!-- ELSE -->post-icon<!-- ENDIF -->" title="<!-- IF S_IS_LOCKED -->{L_FORUM_LOCKED}<!-- ELSE -->{L_POST_TOPIC}<!-- ENDIF -->">
-				<a href="{U_POST_NEW_TOPIC}" class="button icon-button">
-					<span></span><!-- IF S_IS_LOCKED -->{L_BUTTON_FORUM_LOCKED}<!-- ELSE -->{L_BUTTON_NEW_TOPIC}<!-- ENDIF -->
+			<div class="buttons">
+				<a href="{U_POST_NEW_TOPIC}" class="button icon-button <!-- IF S_IS_LOCKED -->locked-icon<!-- ELSE -->post-icon<!-- ENDIF -->" title="<!-- IF S_IS_LOCKED -->{L_FORUM_LOCKED}<!-- ELSE -->{L_POST_TOPIC}<!-- ENDIF -->">
+					<span><!-- IF S_IS_LOCKED -->{L_BUTTON_FORUM_LOCKED}<!-- ELSE -->{L_BUTTON_NEW_TOPIC}<!-- ENDIF --></span>
 				</a>
 			</div>
-		</div>
 		<!-- ENDIF -->
 
 		<div class="pagination">
diff --git a/phpBB/styles/prosilver/template/viewtopic_body.html b/phpBB/styles/prosilver/template/viewtopic_body.html
index 989e7b3c75..f033686a96 100644
--- a/phpBB/styles/prosilver/template/viewtopic_body.html
+++ b/phpBB/styles/prosilver/template/viewtopic_body.html
@@ -29,11 +29,9 @@
 
 	<div class="buttons">
 	<!-- IF not S_IS_BOT and S_DISPLAY_REPLY_INFO -->
-		<div class="<!-- IF S_IS_LOCKED -->locked-icon<!-- ELSE -->reply-icon<!-- ENDIF -->">
-			<a href="{U_POST_REPLY_TOPIC}" title="<!-- IF S_IS_LOCKED -->{L_TOPIC_LOCKED}<!-- ELSE -->{L_POST_REPLY}<!-- ENDIF -->" class="icon-button button">
-				<span></span><!-- IF S_IS_LOCKED -->{L_BUTTON_TOPIC_LOCKED}<!-- ELSE -->{L_BUTTON_POST_REPLY}<!-- ENDIF -->
-			</a>
-		</div>
+		<a href="{U_POST_REPLY_TOPIC}" class="button icon-button <!-- IF S_IS_LOCKED -->locked-icon<!-- ELSE -->reply-icon<!-- ENDIF -->" title="<!-- IF S_IS_LOCKED -->{L_TOPIC_LOCKED}<!-- ELSE -->{L_POST_REPLY}<!-- ENDIF -->">
+			<span><!-- IF S_IS_LOCKED -->{L_BUTTON_TOPIC_LOCKED}<!-- ELSE -->{L_BUTTON_POST_REPLY}<!-- ENDIF --></span>
+		</a>
 	<!-- ENDIF -->
 	</div>
 
@@ -204,33 +202,33 @@
 				<ul class="post-buttons">
 					<!-- EVENT viewtopic_body_post_buttons_before -->
 					<!-- IF postrow.U_EDIT -->
-						<li class="edit-icon">
-							<a href="{postrow.U_EDIT}" title="{L_EDIT_POST}" class="button icon-button"><span>{L_BUTTON_EDIT}</span></a>
+						<li>
+							<a href="{postrow.U_EDIT}" title="{L_EDIT_POST}" class="button icon-button edit-icon"><span>{L_BUTTON_EDIT}</span></a>
 						</li>
 					<!-- ENDIF -->
 					<!-- IF postrow.U_DELETE -->
-						<li class="delete-icon">
-							<a href="{postrow.U_DELETE}" title="{L_DELETE_POST}" class="button icon-button"><span>{L_DELETE_POST}</span></a>
+						<li>
+							<a href="{postrow.U_DELETE}" title="{L_DELETE_POST}" class="button icon-button delete-icon"><span>{L_DELETE_POST}</span></a>
 						</li>
 					<!-- ENDIF -->
 					<!-- IF postrow.U_REPORT -->
-						<li class="report-icon">
-							<a href="{postrow.U_REPORT}" title="{L_REPORT_POST}" class="button icon-button"><span>{L_REPORT_POST}</span></a>
+						<li>
+							<a href="{postrow.U_REPORT}" title="{L_REPORT_POST}" class="button icon-button report-icon"><span>{L_REPORT_POST}</span></a>
 						</li>
 					<!-- ENDIF -->
 					<!-- IF postrow.U_WARN -->
-						<li class="warn-icon">
-							<a href="{postrow.U_WARN}" title="{L_WARN_USER}" class="button icon-button"><span>{L_WARN_USER}</span></a>
+						<li>
+							<a href="{postrow.U_WARN}" title="{L_WARN_USER}" class="button icon-button warn-icon"><span>{L_WARN_USER}</span></a>
 						</li>
 					<!-- ENDIF -->
 					<!-- IF postrow.U_INFO -->
-						<li class="info-icon">
-							<a href="{postrow.U_INFO}" title="{L_INFORMATION}" class="button icon-button"><span>{L_INFORMATION}</span></a>
+						<li>
+							<a href="{postrow.U_INFO}" title="{L_INFORMATION}" class="button icon-button info-icon"><span>{L_INFORMATION}</span></a>
 						</li>
 					<!-- ENDIF -->
 					<!-- IF postrow.U_QUOTE -->
-						<li class="quote-icon">
-							<a href="{postrow.U_QUOTE}" title="{L_REPLY_WITH_QUOTE}" class="button icon-button"><span>{L_QUOTE}</span></a>
+						<li>
+							<a href="{postrow.U_QUOTE}" title="{L_REPLY_WITH_QUOTE}" class="button icon-button quote-icon"><span>{L_QUOTE}</span></a>
 						</li>
 					<!-- ENDIF -->
 					<!-- EVENT viewtopic_body_post_buttons_after -->
@@ -344,11 +342,9 @@
 <div class="topic-actions">
 	<div class="buttons">
 	<!-- IF not S_IS_BOT and S_DISPLAY_REPLY_INFO -->
-		<div class="<!-- IF S_IS_LOCKED -->locked-icon<!-- ELSE -->reply-icon<!-- ENDIF -->">
-			<a href="{U_POST_REPLY_TOPIC}" title="<!-- IF S_IS_LOCKED -->{L_TOPIC_LOCKED}<!-- ELSE -->{L_POST_REPLY}<!-- ENDIF -->" class="button icon-button">
-				<span></span><!-- IF S_IS_LOCKED -->{L_BUTTON_TOPIC_LOCKED}<!-- ELSE -->{L_BUTTON_POST_REPLY}<!-- ENDIF -->
-			</a>
-		</div>
+		<a href="{U_POST_REPLY_TOPIC}" class="button icon-button <!-- IF S_IS_LOCKED -->locked-icon<!-- ELSE -->reply-icon<!-- ENDIF -->" title="<!-- IF S_IS_LOCKED -->{L_TOPIC_LOCKED}<!-- ELSE -->{L_POST_REPLY}<!-- ENDIF -->">
+			<span><!-- IF S_IS_LOCKED -->{L_BUTTON_TOPIC_LOCKED}<!-- ELSE -->{L_BUTTON_POST_REPLY}<!-- ENDIF --></span>
+		</a>
 	<!-- ENDIF -->
 	</div>
 
diff --git a/phpBB/styles/prosilver/theme/buttons.css b/phpBB/styles/prosilver/theme/buttons.css
index 3cbeb1a6e7..05c6ea7939 100644
--- a/phpBB/styles/prosilver/theme/buttons.css
+++ b/phpBB/styles/prosilver/theme/buttons.css
@@ -23,7 +23,7 @@
 }
 
 .icon-button, .dropdown-select {
-	padding-right: 22px;
+	padding-right: 20px;
 }
 
 .icon-button.dropdown-select {
@@ -31,11 +31,17 @@
 }
 
 .icon-button span {
+	display: inline-block;
+	float: right;
+}
+
+.icon-button span:after {
 	background: transparent 0 0 no-repeat;
-	display: block;
+	content: '';
+	display: inline-block;
 	float: right;
 	height: 12px;
-	margin: 3px -16px 0 0;
+	margin: 3px -14px 0 0;
 	width: 12px;
 }
 
@@ -54,7 +60,7 @@
 	background-position: -103px -10px;
 }
 
-.buttons, .buttons div {
+.buttons, .buttons .button {
 	float: left;
 }
 
@@ -63,29 +69,29 @@
 }
 
 /* Big button images */
-.reply-icon a span, .pmreply-icon a span					{ background-position: -20px 0; }
-.reply-icon a:hover span, .pmreply-icon a:hover span		{ background-position: -20px -20px; }
+.reply-icon span:after, .pmreply-icon span:after						{ background-position: -20px 0; }
+.reply-icon:hover span:after, .pmreply-icon:hover span:after			{ background-position: -20px -20px; }
 
-.post-icon a span, .newpm-icon a span, .reply-all a span	{ background-position: 0 0; }
-.post-icon a:hover span,
-.newpm-icon a:hover span,
-.reply-all a:hover span										{ background-position: 0 -20px; }
+.post-icon span:after, .newpm-icon span:after, .reply-all span:after	{ background-position: 0 0; }
+.post-icon:hover span:after,
+.newpm-icon:hover span:after,
+.reply-all:hover span:after												{ background-position: 0 -20px; }
 
-.locked-icon a span											{ background-position: -60px 0; }
-.locked-icon a:hover span									{ background-position: -60px -20px; }
+.locked-icon span:after													{ background-position: -60px 0; }
+.locked-icon:hover span:after											{ background-position: -60px -20px; }
 
-.forwardpm-icon a span										{ background-position: -40px 0; }
-.forwardpm-icon a:hover span								{ background-position: -40px -20px; }
+.forwardpm-icon span:after												{ background-position: -40px 0; }
+.forwardpm-icon:hover span:after										{ background-position: -40px -20px; }
 
-.tools-icon span {
+.tools-icon span:after {
 	background-position: -80px 0;
 	height: 16px;
 	margin-top: 2px;
 	width: 16px;
 }
 
-.dropdown-visible .tools-icon span,
-.nojs .dropdown-container:hover .tools-icon span		{ background-position: -80px -20px; }
+.dropdown-visible .tools-icon span:after,
+.nojs .dropdown-container:hover .tools-icon span:after		{ background-position: -80px -20px; }
 
 /* Icon images
 ---------------------------------------- */
@@ -176,32 +182,35 @@ ul.linklist.bulletin li.small-icon:before {
 
 .post-buttons .icon-button {
 	padding: 0 5px;
-	text-indent: -9999px;
 }
 
 .hastouch .post-buttons .icon-button {
 	padding: 2px 8px;
 }
 
-.post-buttons span {
+.post-buttons .icon-button span {
+	font-size: 0;
+}
+
+.post-buttons .icon-button span:after {
 	float: none;
 	margin-right: 0;
 }
 
-.quote-icon span		{ background-position: 0 0; }
-.quote-icon:hover span	{ background-position: 0 -21px; }
-.edit-icon span			{ background-position: -15px 0; }
-.edit-icon:hover span	{ background-position: -15px -21px; }
-.warn-icon span			{ background-position: -86px 0; }
-.warn-icon:hover span	{ background-position: -86px -21px; }
-.delete-icon span		{ background-position: -30px 0; }
-.delete-icon:hover span	{ background-position: -30px -21px; }
-.report-icon span		{ background-position: -43px 0; }
-.report-icon:hover span	{ background-position: -43px -21px; }
-.info-icon span			{ background-position: -54px 0; }
-.info-icon:hover span	{ background-position: -54px -21px; }
-.button.responsive-menu-link span		{ background-position: -68px 0; }
-.button.responsive-menu-link:hover span	{ background-position: -68px -21px; }
+.quote-icon span:after							{ background-position: 0 0; }
+.quote-icon:hover span:after					{ background-position: 0 -21px; }
+.edit-icon span:after							{ background-position: -15px 0; }
+.edit-icon:hover span:after						{ background-position: -15px -21px; }
+.warn-icon span:after							{ background-position: -86px 0; }
+.warn-icon:hover span:after						{ background-position: -86px -21px; }
+.delete-icon span:after							{ background-position: -30px 0; }
+.delete-icon:hover span:after					{ background-position: -30px -21px; }
+.report-icon span:after							{ background-position: -43px 0; }
+.report-icon:hover span:after					{ background-position: -43px -21px; }
+.info-icon span:after							{ background-position: -54px 0; }
+.info-icon:hover span:after						{ background-position: -54px -21px; }
+.button.responsive-menu-link span:after			{ background-position: -68px 0; }
+.button.responsive-menu-link:hover span:after	{ background-position: -68px -21px; }
 
 /* Responsive buttons in post body */
 .post-buttons .dropdown {
diff --git a/phpBB/styles/prosilver/theme/colours.css b/phpBB/styles/prosilver/theme/colours.css
index 5d45120131..84791727c4 100644
--- a/phpBB/styles/prosilver/theme/colours.css
+++ b/phpBB/styles/prosilver/theme/colours.css
@@ -725,9 +725,9 @@ Colours and backgrounds for buttons.css
 .icon-print						{ background-image: url("./images/icon_print.gif"); }
 
 /* Profile & navigation icons */
-.contact-icon								{ background-image: url("./images/icons_contact.png"); }
-.icon-button span, .dropdown-select:after	{ background-image: url("./images/buttons.png"); }
-.post-buttons .icon-button span				{ background-image: url("./images/post_buttons.png"); }
+.contact-icon									{ background-image: url("./images/icons_contact.png"); }
+.icon-button span:after, .dropdown-select:after	{ background-image: url("./images/buttons.png"); }
+.post-buttons .icon-button span:after			{ background-image: url("./images/post_buttons.png"); }
 
 /* Forum icons & Topic icons */
 .global_read													{ background-image: url("./images/announce_read.gif"); }