<head> section not being read - ruby-on-rails

I'm a beginner to coding and have what seems to be a beginner question. I'm working in Ruby on Rails.
It appears that (all of a sudden) my application is ignoring my section across all of my pages. The implications are that the title is not appearing on the browser tabs and the css is not rendering in the mobile production environment (although it is working on desktop dev/prod and mobile prod). the code is below. Can someone help me? Thanks in advance!
<!DOCTYPE html>
<head>
<title>Home | XXXX</title>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<!--[if lte IE 8]><script src="assets/js/ie/html5shiv.js"></script><![endif]-->
<link rel="stylesheet" href="assets/css/main.css" />
<!--[if lte IE 8]><link rel="stylesheet" href="assets/css/ie8.css" /><![endif]-->
</head>

It must be inside tag. Please check your code. Hope this will help you.
<!DOCTYPE html>
<html>
<head>
<title>Home | XXXX</title>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<!--[if lte IE 8]><script src="assets/js/ie/html5shiv.js"></script><![endif]-->
<link rel="stylesheet" href="assets/css/main.css" />
<!--[if lte IE 8]><link rel="stylesheet" href="assets/css/ie8.css" /><![endif]-->
</head>
</html>

Related

how to show Favicon using local server in Microsoft Edge(although it is working fine in Google Chrome and IE) ?

<!DOCTYPE html>
<html lang="en" class="teradata-bootstrap marketing-operations" ng-app="marketingOps">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="shortcut icon" href="favicon.ico" type="image/x-icon" />
</head>
</html>
I used portion in my code its working in chrome but not in Edge.
<link rel="shortcut icon" href="http://yoursite.com/favicon.ico" type="image/x-icon" />

I can't serve css files ASP MVC

I'm using dotnetcore and ASP MVC.
The problem is that I don't know how to serve correctly my css and images files.
Here you can see the file structure:
Here is the Shared layout's head.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="Galeria de comics">
<title>#ViewBag.Title - Galeria de comics</title>
<link rel="stylesheet" href="~/wwwroot/css/normalize.css">
<link rel="stylesheet" href="~/wwwroot/css/main.css">
</head>
<body>
<header class="main-header"></header>
#RenderBody()
</body>
</html>
I'm called this layout in a View.
#{
Layout = "~/Views/Shared/_Layout.cshtml";
ViewBag.Title = "Libro comic detalle";
}
What's the problem?
The problem is that the CSS files aren't serve so I can't see the styles.
Any solition?
Seems I miss the href attribute's content. You should skip the wwwroot folder since the static files are served as http://app/css/cssFileName. Example: http://yoursite.com/css/main.css, same with images and js files.
Here I fixed the problem:
<link rel="stylesheet" href="~/css/normalize.css">
<link rel="stylesheet" href="~/css/main.css">
If you want to know more visit this link

Bootstrap not responsive on iOS

I am using Bootstrap 3 for my website and I can't figure why it's not responsive on iOS (shows like the desktop view). I have already do a quick search about this problem and yes I use the template code provided by Bootstrap but it still doesn't seem to work. Here is the beginning of my code:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Laurent Doucet — Graphic designer</title>
<meta name="description" content="—">
<link rel="icon" href="img/favicon.png">
<link href="css/bootstrap.min.css" rel="stylesheet">
<link href="css/fonts.css" rel="stylesheet">
Here is my website: http://www.laurentdoucet.be
Thanks a lot for the help.
Your use of frames is preventing your viewport tag from working.
You need to include a viewport meta tag in the outer page also:
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>www.laurentdoucet.be</title>
</head>
<frameset>
<frame src="http://www.bepxlagency.be/laurentdoucet/" name="redir">
<noframes>
<p>Original location:
http://www.bepxlagency.be/laurentdoucet/
</p>
</noframes>
</frameset>
</html>

Touch events in JQM + IE10 + W8

I've found a strange issue when using JQM + IE10 and touchscreeen on a Windows 8 tablet. When using an external mouse och the trackpad everything works as expected but when I'm using the touch screen normal links in JQM are not working.
Having two very basic JQM pages, b.html:
<!DOCTYPE html>
<html>
<head>
<title>Page Title</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.3.1/jquery.mobile-1.3.1.min.css" />
<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script src="http://code.jquery.com/mobile/1.3.1/jquery.mobile-1.3.1.min.js"></script>
</head>
<body>
this is b.html
link to a.html
</body>
</html>
and a.html
<!DOCTYPE html>
<html>
<head>
<title>Page Title</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.3.1/jquery.mobile-1.3.1.min.css" />
<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script src="http://code.jquery.com/mobile/1.3.1/jquery.mobile-1.3.1.min.js"></script>
</head>
<body>
this is a.html
link to b.html
</body>
</html>
Navigation gets stuck on the second one using the touch screen, mouse and trackpad working fine. I guess this is connected to JQM ajax navigation model and the new touch events in IE10, but can't figure out exactly how to solve this.
Chrome is working fine with both mouse/trackpad and touch screen.
EDIT: Might have found a possible workaround, adding this to the css
a {
-ms-touch-action: none;
}

Opening links in a frame target IE10 Start app for Windows 8

I have a page being showed in two frames
<frameset cols="140,*">
<frame src="resources/nav-bar.html" id="nav-bar" frameborder=0 scrolling="no" noresize="noresize" />
<frame src="resources/home.html" id="main" frameborder=0 scrolling="yes" noresize="noresize" />
</frameset>
Then in the frame named nav-bar I have links targeted to main like this:
Personal details
In Google Chrome and Safari this works with no issues but IE10 for Windows 8 when run from the Start opens the link in a new tab instead. Nevertheless if I run IE10 from the desktop I have no such issue. How can this be fixed? Thanks in advance.
EMILIO!
It's a sad little problem and apparently Microsoft is aware of it. (See http://support.microsoft.com/kb/2793437, for example.) What makes it even sadder is it seems to only appear on Windows 8, IE10 running on Windows 7 does not exhibit this problem. I manage to solve it by replacing the markup for the page I am using to navigate around, in your example the resources/nav-bar.html file. I changed:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.or/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Blah blah</title>
<link rel="stylesheet" href="./some.css" type="text/css" media="screen" />
</head>
...
to
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>Blah blah</title>
<link rel="stylesheet" href="./some.css" type="text/css" media="screen" />
</head>
...
Give it a go.
Try using property name.
name="main"

Resources