Browser: Chrome 110
OS: macOS / Windows / Linux / etc.
URL: MUSE AU CHOCOLAT | ANNIVERSARY PARTY 🤎 – EVENT | OMUSE
Video:
dont ask me why there is emoji in title. our client likes to use it 
culprit is justify-content: space-between; in the .woocommerce-notices-wrapper .woocommerce-message
Hi Sinan,
Thanks so much for your report!
Unfortunately, I cannot reproduce or see the issue on your website (the default styles are still applying as far as I can see).
Best regards,
timmse
is that safari?
try chrome
I am on win 10 - chrome
No, it’s Chrome on macOs.
As far as I can see, the problem is not with the browser or theme but solely with Windows. The emoji is rendered as an img under Windows since otherwise, Windows can’t display it correctly. There’s nothing we can do about it.
If your customer insists on including emojis in their titles, you can overwrite the default CSS remove the justify-content, and give the button a margin-left: auto instead or work with floats.
Source ChatGPT: Why does Windows render emoji as img?
Windows renders emojis as images in certain cases because it does not use a true native emoji font in all applications. Instead, Windows relies on a system called “Segoe UI Emoji”, which contains glyphs for emoji characters. However, how these emojis are rendered depends on the application and the Windows version.
Reasons Why Windows Renders Emojis as Images
- Lack of Native Color Font Support in Some Apps
- Windows uses Segoe UI Emoji as the default emoji font. While this supports colored emojis, many applications (e.g., Notepad, some browsers) don’t fully support color font rendering.
- Instead, these applications may render emojis as black-and-white glyphs or fall back to image-based rendering.
- Web Browsers and Custom Rendering
- Some web browsers (like Chrome, Edge, and Firefox) may override Windows’ emoji rendering and use Twemoji (Twitter Emoji), Noto Color Emoji (Google), or Apple’s emoji set by loading emojis as images instead of relying on the system font.
- Windows Falls Back to Bitmap Images for Some Emojis
- When an application doesn’t fully support OpenType-SVG fonts (the format Windows uses for color emojis), Windows may fall back to rendering emojis as bitmap images instead.
- Variable System Behavior in Different Windows Versions
- Older versions of Windows (pre-Windows 10) didn’t support color emojis at all, so they always used black-and-white glyphs or images.
- Windows 10 and later introduced OpenType-SVG emojis, but some legacy apps don’t support this format correctly.
- Scaling & Consistency
- Rendering emojis as images ensures consistent display across different screen resolutions and devices.
- It also allows Microsoft to update emoji designs without relying entirely on font updates.
ok wordpress emojis causing. wordpress force replacing the normal emojis with wp.org cdn ones and thats creating this css break
disabling emojis fixes this issue.
the bug coming from the wp core.
if anyone needs it;
// Disable Emoji scripts and styles
function disable_emojis() {
remove_action('wp_head', 'print_emoji_detection_script', 7);
remove_action('admin_print_scripts', 'print_emoji_detection_script');
remove_action('wp_print_styles', 'print_emoji_styles');
remove_action('admin_print_styles', 'print_emoji_styles');
remove_filter('the_content_feed', 'wp_staticize_emoji');
remove_filter('comment_text_rss', 'wp_staticize_emoji');
remove_filter('wp_mail', 'wp_staticize_emoji_for_email');
add_filter('tiny_mce_plugins', 'disable_emojis_tinymce');
add_filter('wp_resource_hints', 'disable_emojis_dns_prefetch', 10, 2);
}
// Disable Emojis in TinyMCE (Classic Editor)
function disable_emojis_tinymce($plugins) {
if (is_array($plugins)) {
return array_diff($plugins, array('wpemoji'));
}
return array();
}
// Remove Emoji DNS prefetch
function disable_emojis_dns_prefetch($urls, $relation_type) {
if ('dns-prefetch' === $relation_type) {
$emoji_url = 'https://s.w.org/images/core/emoji/';
$urls = array_diff($urls, array($emoji_url));
}
return $urls;
}
// Hook the disable function into WordPress
add_action('init', 'disable_emojis');
