Index: /CKEditor/trunk/CHANGES.html
===================================================================
--- /CKEditor/trunk/CHANGES.html	(revision 5311)
+++ /CKEditor/trunk/CHANGES.html	(revision 5312)
@@ -111,4 +111,5 @@
 		<li><a href="http://dev.fckeditor.net/ticket/5372">#5372</a> : Newly created sub list should not inheirt nothing from the original (parent) list except list type.</li>
 		<li><a href="http://dev.fckeditor.net/ticket/5274">#5274</a> : [IE6] Templates preview image is displayed in wrong size.</li>
+		<li><a href="http://dev.fckeditor.net/ticket/5292">#5292</a> : Preview in font size and family doesn't work with custom styles.</li>
 		<li>Updated the following language files:<ul>
 			<li>Faroese;</li>
Index: /CKEditor/trunk/_source/plugins/font/plugin.js
===================================================================
--- /CKEditor/trunk/_source/plugins/font/plugin.js	(revision 5311)
+++ /CKEditor/trunk/_source/plugins/font/plugin.js	(revision 5312)
@@ -30,4 +30,5 @@
 
 				styles[ name ] = new CKEDITOR.style( styleDefinition, vars );
+				styles[ name ]._.definition.name = name;
 			}
 			else
@@ -56,5 +57,5 @@
 
 						// Add the tag entry to the panel list.
-						this.add( name, '<span style="font-' + styleType + ':' + values[ i ] + '">' + name + '</span>', name );
+						this.add( name, styles[ name ].buildPreview(), name );
 					}
 				},
Index: /CKEditor/trunk/_source/plugins/styles/plugin.js
===================================================================
--- /CKEditor/trunk/_source/plugins/styles/plugin.js	(revision 5311)
+++ /CKEditor/trunk/_source/plugins/styles/plugin.js	(revision 5312)
@@ -299,4 +299,37 @@
 			}
 			return false;
+		},
+
+		// Builds the preview HTML based on the styles definition.
+		buildPreview : function()
+		{
+			var styleDefinition = this._.definition,
+				html = [],
+				elementName = styleDefinition.element;
+
+			// Avoid <bdo> in the preview.
+			if ( elementName == 'bdo' )
+				elementName = 'span';
+
+			html = [ '<', elementName ];
+
+			// Assign all defined attributes.
+			var attribs	= styleDefinition.attributes;
+			if ( attribs )
+			{
+				for ( var att in attribs )
+				{
+					html.push( ' ', att, '="', attribs[ att ], '"' );
+				}
+			}
+
+			// Assign the style attribute.
+			var cssStyle = CKEDITOR.style.getStyleText( styleDefinition );
+			if ( cssStyle )
+				html.push( ' style="', cssStyle, '"' );
+
+			html.push( '>', styleDefinition.name, '</', elementName, '>' );
+
+			return html.join( '' );
 		}
 	};
Index: /CKEditor/trunk/_source/plugins/stylescombo/plugin.js
===================================================================
--- /CKEditor/trunk/_source/plugins/stylescombo/plugin.js	(revision 5311)
+++ /CKEditor/trunk/_source/plugins/stylescombo/plugin.js	(revision 5312)
@@ -86,5 +86,5 @@
 									combo.add(
 										styleName,
-										style.type == CKEDITOR.STYLE_OBJECT ? styleName : buildPreview( style._.definition ),
+										style.type == CKEDITOR.STYLE_OBJECT ? styleName : style.buildPreview(),
 										styleName );
 								}
@@ -191,36 +191,4 @@
 	});
 
-	function buildPreview( styleDefinition )
-	{
-		var html = [];
-
-		var elementName = styleDefinition.element;
-
-		// Avoid <bdo> in the preview.
-		if ( elementName == 'bdo' )
-			elementName = 'span';
-
-		html = [ '<', elementName ];
-
-		// Assign all defined attributes.
-		var attribs	= styleDefinition.attributes;
-		if ( attribs )
-		{
-			for ( var att in attribs )
-			{
-				html.push( ' ', att, '="', attribs[ att ], '"' );
-			}
-		}
-
-		// Assign the style attribute.
-		var cssStyle = CKEDITOR.style.getStyleText( styleDefinition );
-		if ( cssStyle )
-			html.push( ' style="', cssStyle, '"' );
-
-		html.push( '>', styleDefinition.name, '</', elementName, '>' );
-
-		return html.join( '' );
-	}
-
 	function sortStyles( styleA, styleB )
 	{