diff --git a/rudder-web/src/main/webapp/javascript/rudder/rudder-datatable.js b/rudder-web/src/main/webapp/javascript/rudder/rudder-datatable.js
index ff8fdd2bae4..c902492466b 100644
--- a/rudder-web/src/main/webapp/javascript/rudder/rudder-datatable.js
+++ b/rudder-web/src/main/webapp/javascript/rudder/rudder-datatable.js
@@ -639,13 +639,10 @@ function createExpectedReportTable(gridId, data, contextPath, refresh) {
       , "sTitle": "Directive"
       , "fnCreatedCell" : function (nTd, sData, oData, iRow, iCol) {
           $(nTd).addClass("listopen tw-bs");
-          var tooltipIcon = $("<img />");
-          tooltipIcon.attr("src",resourcesPath + "/images/ic_question_14px.png");
-          tooltipIcon.addClass("reportIcon");
+          var tooltipIcon = $("<i>");
+          tooltipIcon.addClass("fa fa-question-circle icon-info reportIcon");
           var tooltipId = oData.jsid+"-tooltip";
-          tooltipIcon.attr("tooltipid",tooltipId);
-          tooltipIcon.attr("title","");
-          tooltipIcon.addClass("tooltip tooltipable");
+          tooltipIcon.attr("tooltip",tooltipId);
           var toolTipContainer= $("<div>Directive '<b>"+sData+"</b>' is based on technique '<b>"+oData.techniqueName+"</b>' (version "+oData.techniqueVersion+")</div>");
           toolTipContainer.addClass("tooltipContent");
           toolTipContainer.attr("id",tooltipId);
diff --git a/rudder-web/src/main/webapp/templates-hidden/components/ComponentRuleEditForm.html b/rudder-web/src/main/webapp/templates-hidden/components/ComponentRuleEditForm.html
index d65c687a621..4f68372aa0b 100644
--- a/rudder-web/src/main/webapp/templates-hidden/components/ComponentRuleEditForm.html
+++ b/rudder-web/src/main/webapp/templates-hidden/components/ComponentRuleEditForm.html
@@ -197,7 +197,7 @@
         <div id="DirectiveCtrl" ng-controller="DirectiveCtrl">
           <div class="spacing-title targetHeader">
             Apply these Directives:
-            <img src="/images/ic_question.png" data-lift="with-cached-resource" class="targetIcon" tooltip="directiveAddExplanation"/>
+            <i class="fa fa-question-circle targetIcon icon-info" aria-hidden="true" tooltip="directiveAddExplanation"></i>
           </div>
           <div style="background-color:#DDFFDD;" class="targetContainer">
             <ul>
@@ -250,7 +250,7 @@
         <div id="GroupCtrl" ng-controller="GroupCtrl">
           <div class="spacing-title targetHeader">
             Apply to Nodes in any of these Groups:
-            <img src="/images/ic_question.png" data-lift="with-cached-resource" class="targetIcon" tooltip="includeExplanation"/>
+            <i class="fa fa-question-circle targetIcon icon-info" aria-hidden="true" tooltip="includeExplanation"></i>
           </div>
           <div style="background-color:#DDFFDD;" class="targetContainer">
 	        <ul>
@@ -269,7 +269,7 @@
           </div>
           <div class="spacing-title targetHeader">
             Except to Nodes in any of these Groups:
-            <img src="/images/ic_question.png" data-lift="with-cached-resource" class="targetIcon" tooltip="excludeExplanation"/>
+            <i class="fa fa-question-circle targetIcon icon-info" aria-hidden="true" tooltip="excludeExplanation"></i>
           </div>
           <div style="background-color:#FFDDDD;" class="targetContainer">
             <ul>