I manage a website catering to the Burmese community, with content in the Burmese language. However, I have encountered an issue where the text appears broken due to using Zawgyi format instead of Unicode format in Myanmar. How can I resolve this problem?
https://i.sstatic.net/O06M7.png
Interestingly, this error seems to be specific to iPhones only.
Utilize font linking and embedding to ensure all fonts display correctly on any device or browser, without the need for specific installations. If you're looking for more Myanmar font options, visit
<!DOCTYPE html>
<html lang="en>
<head>
<meta charset="UTF-8>
<title>Document</title>
<link rel="stylesheet" href='https://mmwebfonts.comquas.com/fonts/?font=myanmar3' />
<link rel="stylesheet" href='https://mmwebfonts.comquas.com/fonts/?font=zawgyi' />
<style type="text/css">
.zawgyi{
font-family:Zawgyi-One;
}
.unicode{
font-family:Myanmar3,Yunghkio,'Masterpiece Uni Sans';
}
</style>
</head>
<body>
<h3>This is for ZawGyI font</h3>
<p class="zawgyi">
သည္စာသည္ ေဇာ္ဂ်ီ ျဖင့္ေရးေသာစာျဖစ္သည္
</p>
<h3>This is for unicode (myanmar3) font</h3>
<p class="unicode">
သည်စာသည် unicode ဖြင့်ရေးသောစာဖြစ်သည်
</p>
</body>
</html>Knayi offers a reliable solution for converting or detecting different font types like Unicode and Zawgyi.
To utilize Knayi, you have the option to either load the script via CDN or NPM and then employ kanayi.fontConvert();
// Necessary parameters
kanayi.fontConvert(content, targetFontType , originalFontType)
knayi.fontConvert('မဂၤလာပါ', 'unicode', 'zawgyi') // မင်္ဂလာပါ
knayi.fontConvert('မဂၤလာပါ', 'unicode') // မင်္ဂလာပါ
In addition, I have developed a WordPress widget using Knayi.
https://github.com/ronaldaug/auto-font
Ensure to include at least 2 or 3 additional fonts as fallback options
.zawgyi{
font-family: Zawgyi-One, second fall back font, third fall back font;
}
This setup ensures that if the primary font is not supported, the browser will use the second option and then the third one on various platforms.
When a vertical navigation menu item is selected, a border appears below the item. How can I remove this border? .nav-tabs li, .nav-tabs li a { border-bottom: none; } Here is a picture of the border: ...
I am looking to create a basic HTML layout with CSS that includes a header and two columns. The right column should have a fixed width of 100px, while the left column may have varying content lengths. I want both columns to stretch to the footer. Below is ...
Currently, I am developing an eCommerce application that features a popup window for users when they click on "Add to Cart." This popup allows users to select product variations and quantities before adding the item to their cart. The popup consists of a s ...
I just started working with bootstrap design, and I encountered an issue with my slider images. There is a gray color around the slider images that I want to change, but my attempts are not yielding results. Here is what I tried: https://i.sstatic.net/xnsF ...
I'm having trouble with aligning my sidebar vertically between the header and the bottom of the browser window. Currently, the bottom items are extending beyond the browser's bottom edge. How can I adjust this to ensure proper alignment? Here is ...
Can someone share a method to iterate through an object array in JavaScript? I have an array called sample where the property options needs to be displayed using lit-HTML for each object. var sample = [{ "trans": [{ "id": "trans", "fee": 20, ...
Currently, I am utilizing ejs to handle my HTML tasks and I have come across an issue where I cannot use the usual document.getElementById('id') method within this environment. The error message displayed states "document not defined". This has ...
Check out my code below: http://jsfiddle.net/parag1111/s5RLb/ Make sure to place PIE.htc in the CSS folder. I've already included the necessary JS and behavior for PIE.htc. Please provide any additional suggestions to ensure compatibility with IE8 a ...
I am working with a WordPress site that has ajax navigation. Whenever a user clicks on a link on the left side, the HTML content within <div class="page-details"></div> is loaded. My goal is to preload any images that will be displayed in this ...
I'm encountering an alignment issue when using Bootstrap in Visual Studio, specifically with Bootstrap columns. When I use a div with the class col-md-4, it automatically adds some space to the right and doesn't align properly. However, when I wr ...
Below is the code snippet I have in my HTML table. <table> <tbody> <thead> <tr> <th align="right" colspan="4"> <span class="font-style-bold">SCHEDULE OF RATES</span> ...
I've been searching high and low on the internet for a solution like this, but so far I haven't had any luck. It seems like there might be a JavaScript script out there that dynamically changes the css -webkit-transform: rotateY(deg) property. ...
Is there a way to prevent my col-xl-* from growing too large on larger monitors? I've noticed that when I view it on my laptop (1280 width) and desktop (1920), the col-xl setting is either too big on the desktop or too small on the laptop. <div c ...
I have set up styles in my Word document, such as My_Style (which I use for titles). I am looking to create entries for illustrations that correspond to the number from that particular style. Here is the code snippet I am using: Sub Macro4() ' &apos ...
This issue has been addressed previously, but despite implementing the suggestions provided, I am still encountering the same problem. Uncaught typeError: Cannot read property 'owlCarousel' of null I have a Magento store using the Ultimo templat ...
There are two div elements in my code: <div id="ing" style="position:relative;"> <div id="comm" style="position: absolute; width: 27% !important; height: 141px; right: 18px; top: 1px; "> </div> </div> After that, I set T ...
Here is the code snippet I am currently working with: <?php query_posts("order=ASC&cat=4"); ?> <?php if(have_posts()): while(have_posts()): the_post(); ?> <?php if(get_post_custom_values("show") != NULL): ?> ...
I am facing an issue with displaying overlay and popup within an iframe on my aspx page. The iframe is calling another aspx page that includes the overlay and popup div elements. When I click a button within the iframe, the overlay and popup appear but t ...
I'm currently utilizing electron([email protected]) along with bootstrap([email protected]). Whenever I attempt to incorporate a dropdown or other components from Bootstrap, they simply do not function. I am unsure of what mistake I might ha ...
Currently, I am facing an issue with an image element in my project. The path for this image is being fetched from an attribute present on my angular object. However, if this imagePath attribute is empty, a broken image is displayed. I want to avoid rend ...