I have a simple HTML page with some <sub> elements in it. For some reason, Google Translate offers to translate the subscripts from Arabic to English (despite being English to begin with), only moving them down a little when translated. The HTML page language is set to en-US. Is this just my computer being weird, or is there a code-related reason?
<!DOCTYPE html>
<html lang="en-US">
<head>
<!--<meta name="google" content="notranslate"> (this successfully gets rid of the translate popup, commented out for testing purposes)-->
<meta charset="utf-8"/>
<meta name="viewport" content="initial-scale=1, maximum-scale=1"/>
<title>test</title>
<link rel="icon" href="favicon.svg" type="image/svg"/>
<link href="style.css" rel="stylesheet" type="text/css"/>
<link href="https://fonts.googleapis.com/css?family=Roboto" rel="stylesheet"/>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script src="functions.js"></script>
<script src="main.js" defer></script>
</head>
<body style="min-width: 0">
<div id="test"></div>
</body>
</html>
Added to #test by JS:
<div class="letter">A<sub>1</sub></div>
Website: https://test.edgeloop.repl.co
Screenshot: screenshot
Are you sure that this is the correct code? You seem to have a <html...>-tag inside your <head>-tag. Remove the duplicate html-tag inside your head, and instead add the lang="en"-attribute to your outer-most html-tag.
Your code should thus look as follows:
<!DOCTYPE html>
<html lang="en-US">
<head>
<meta charset="utf-8">
<meta name="viewport" content="initial-scale=1, maximum-scale=1">
<title>test</title>
....
</head>
<body style="min-width: 0">
<div id="test"></div>
</body>
</html>
If this does not immediately solve your problem, try clearing the google chrome cache as follows:
Press F12 to open the dev tools menu
Right-click your refreh-button
Select the option empty cache and hard refresh:
If your webpage uses HTML and XML interchangably, you might need to add the following to your opening <html>-tag (see this link):
<html lang="en" xml:lang="en" xmlns="http://www.w3.org/1999/xhtml">
...
</html>
If your Google Translate does still pop up, you have the following options:
add translate="no" to your root html-tag
add the class notranslate to your root html-tag
add <meta name="google" content="notranslate"> to your head-tag
Your code should look as follows:
<html lang="en" translate="no" class="notranslate">
<head>
<meta name="google" content="notranslate"/>
....
</head>
....
</html>
#Lawrence Cherone's comment about adding more text seems to fix the problem, as does #unknown6656's suggestion of adding <meta name="google" content="notranslate">. I still don't know why subscripts are considered Arabic text, but adding English text seems to fix the problem. Thanks for all the answers.
Related
So I have been creating my own website and I have run into an issue were for some reason IE is not seeing my Doctype. My site is https://houdea.github.io/index.html, and if you were to open it in IE it would throw errors that makes no sense. Now below is the code for my header of that page.
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Andrew Houde</title>
<!-- Style sheets -->
<link href='https://fonts.googleapis.com/css?family=Lato:300,400,700' rel='stylesheet' type='text/css'>
<link href="css/homepage.css" rel='stylesheet' charset="UTF-8">
<link href="css/aboutme.css" rel='stylesheet' charset="UTF-8">
</head>
Now If you go to this page https://houdea.github.io/site/contact.html it will work fine in IE. I just don't get why that is when they are the same code. So how do I get this to work in IE?
I see that you have this <?xml version="1.0" encoding="utf-8"?> on your first line of code in index.html. The correct format of a html file should start with <!DOCTYPE>. You need to remove this line then I think it will work in IE.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content= "ie= edge">
<title>Blooger</title>
<link rel="stylesheet" type="text/css" href="./css/style.css" />
</head>
I have searched a lot, checked my syntax of linking css n times and spelling of style sheet is correct, the folder I am using is correct I don't know the problem, please help.
I'm not sure whether you've not added it here on SO, but your HTML file doesn't contain anything to show. (no <body></body> or anything within it)
As an example, you need to add
<body>
<h1>My Blog</h1>
<p>welcome to my blog.</p>
</body>
Please check status, type and size in network tab of browser developer tool
I was trying to add css in my blogger's blog but for some reason blogger theme designer is not working so i decided to add css directly in the code using tags, but I can't find the tag in the html file. It is my first time when I am unable to understand where is. Anyone know where tag is in this file to add css?
I did not Code it completely! And the person who did is no longer in contact with me!
Click Here to see Code
To use an external style sheet, add a link to it in the section of the HTML page:
<head>
<link rel="stylesheet" href="styles.css">
</head>
Search for this ]]></b:skin> and place your CSS code before it without using <style>
Or if you want to use a style tag, place it after </b:skin>
The <style> element is used to add CSS style rules to an HTML document. The element is expected to appear in the document <head>, but will also render acceptably when used in the <body> of the document.
Your program should look like this
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="styles.css">
</head>
<body>
<h1>This is a heading</h1>
<p>This is a paragraph.</p>
</body>
</html>
you should add the head tag yourself to the top of the document if you do not have one already. for the href change that to the name of your css file.
<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html>
<HTML amp='amp' lang='en'>
<head>
<meta charset='utf-8'/>
<meta content='width=device-width, initial-scale=1, minimum-scale=1' name='viewport'/>
<!--[if ie]><meta content='IE=9; IE=8; IE=7; IE=EDGE; chrome=1' http-equiv='X-UA-Compatible'/> <![endif]-->
<meta content='blogger' name='generator'/>
<meta content='text/html; charset=UTF-8' http-equiv='Content-Type'/>
<link href='https://justpaste.it/redirect/3qnyk/http://www.blogger.com/openid-server.g' rel='nofollow'/>
<link expr:href='' rel='nofollow'/>
<link expr:href='' rel='nofollow'/>
</head>
I uploaded my website and one of the tab(more info) is in chinese for some reason and I dont know why. here is the the url http://bushdid911.net
http://pastebin.com/jFBUV1ga
At very least, you should add
<meta charset="utf-8">
to the html's <head> section.
A (very, very) basic html template you should use is
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Page title</title>
</head>
<body>
</body>
</html>
Another reason could be that Bush did this, too. Just to create another conspiracy theory..
Google Chrome Audit tool says:
Put CSS in the document head (3) CSS in the document body adversely
impacts rendering performance. Link node bootstrap-extract.css should
be moved to the document head Link node style.css should be moved to
the document head Link node css should be moved to the document head
But the stylesheets are linked in the head. Here is the code:
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" dir="ltr" lang="fr-FR" xml:lang="fr-FR">
<head>
<title>site</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<link rel="stylesheet" type="text/css" href="/resources/css/bootstrap-extract.css">
<link rel="stylesheet" type="text/css" href="/resources/css/style.css">
<link href='http://fonts.googleapis.com/css?family=Lato:300,400,700,900,300italic,400italic,700italic,900italic' rel='stylesheet' type='text/css'>
<script src="http://code.jquery.com/jquery-latest.js"></script>
</head>
<body>
etc.
What am I missing?
Your code looks like it should be valid to me, however, the meta tag shouldn't be closed with />:
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
This could cause the <head> tag to close, but that's very unlikely.
Have you looked at the HTML in Google Chrome to see how it is being displayed in comparison with what the code should look like?