diff --git a/etemplate/js/et2_widget_template.js b/etemplate/js/et2_widget_template.js
index abe58b3d5b..4178aa2064 100644
--- a/etemplate/js/et2_widget_template.js
+++ b/etemplate/js/et2_widget_template.js
@@ -163,6 +163,15 @@ var et2_template = et2_DOMWidget.extend(
 
 	getDOMNode: function() {
 		return this.div;
+	},
+	
+	/**
+	 * Replace . in template-ids with - to simplify css usage, as we do it the unique id already
+	 *  
+	 * @param _id
+	 */
+	set_id: function(_id) {
+		this._super.call(this, _id.replace('.', '-'));
 	}
 });
 et2_register_widget(et2_template, ["template"]);