I have a simple Google maps web application I'm working on. I have purchased a domain name for the application (http://www.jcunav.com), which during my testing, is designed to simply forward to a page which is hosted on my another domain name of mine (http://www.codeemporium.com/experiments/map5.html). Testing on my Android Nexus S, I am noticing strange behaviour however - if I visit http://www.codeemporium.com/experiments/map5.html directly, then the app displays as intended - the map is the size I want and clicking the "About" link brings up a dialog the size I want. If I visit http://www.jcunav.com however (which, keep in mind, simply forwards to http://www.codeemporium.com/experiments/map5.html), the map displays at what looks like a more zoomed out level, and pressing the "About" link at the bottom of the page shows a dialog box which also appears more zoomed out. My question is, what could be causing this to occur, given that all http://www.jcunav.com is doing is forwarding to http://www.codeemporium.com/experiments/map5.html...
Are you certain you aren't frame-forwarding? I examined the page in firebug for each of the links you provided and it appears to me that you are frame-forwarding the URL. This results in your target page being 'wrapped' in a frame when presented to the end user. Odds are high that this is why it is not working for you.
Here is a somewhat lossy version of what is in the forwarded page:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN"
"http://www.w3.org/TR/html4/frameset.dtd">
<html>
<head>
<title>JCU Nav</title>
<META NAME="Keywords" CONTENT="">
<META NAME="Description" CONTENT="">
</head>
<frameset frameborder="0" framespacing="0" border="0" rows="100%,*">
<frame name="MYTOPFRAME" src="http://www.codeemporium.com/experiments/map5.html" noresize>
-- snip --
</frameset>
</html>
Notice the frame tag:
<frameset frameborder="0" framespacing="0" border="0" rows="100%,*">
<frame name="MYTOPFRAME" src="http://www.codeemporium.com/experiments/map5.html" noresize>
This is what happens when you frame forward.
Since your sizing relies on additions to the HTML tag:
<html class="ui-mobile landscape min-width-320px min-width-480px min-width-768px min-width-1024px">
They do not work in the frame-forwarded version because they are nested inside the frame and not on the root page.
That's because http://www.jcunav.com is not forwarding to http://www.codeemporium.com/experiments/map5.html, it is loading it into a frame:
C:\Documents and Settings\blah>wget -S -O - http://www.jcunav.com/
--01:05:21-- http://www.jcunav.com/
=> `-'
Resolving www.jcunav.com... 66.150.161.141, 69.25.27.173, 63.251.171.80, ...
Connecting to www.jcunav.com|66.150.161.141|:80... connected.
HTTP request sent, awaiting response...
HTTP/1.1 200 OK
Date: Sun, 01 May 2011 05:01:11 GMT
Server: Apache/2.0.49 (Unix) PHP/4.3.9
X-Powered-By: PHP/4.3.9
Content-Length: 823
Connection: close
Content-Type: text/html; charset=ISO-8859-1
Length: 823 [text/html]
0% [ ] 0 --.--K/s <
!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN"
"http://www.w3.org/TR/html4/frameset.dtd">
<html>
<head>
<title>JCU Nav</title>
<META NAME="Keywords" CONTENT="">
<META NAME="Description" CONTENT="">
</head>
<frameset frameborder="0" framespacing="0" border="0" rows="100%,*">
<frame name="MYTOPFRAME" src="http://www.codeemporium.com/experiments/map5.html" noresize>
<noframes>
<body>
<h1>JCU Nav</h1>
<br>
<br>
<br>
Click here to enter <a href="http://www.codeemporium.com/experiments/map5.html">http://www.codeemporium.com/e
xperiments/map5.html</a>
<hr>
| Domain Name Registration and Domain Name Forwarding by <a href="http://www.mydomain.com">mydomain.com - Register your
domain name</a>
</body>
</noframes>
</frameset>
</html>
You'll need to actually change that frame set to do the right thing.
Related
I'm working with Sendgrid's template system and need to manually inline some css for content that will be included in the Sendgrid smtpapi call.
Premailer doesn't seem to be actually inlining the css styles. I can inspect the result of calling Premailer.new but the processed_doc and doc both do not have the styles inlined.
Different methods I've tried:
Including the css file directly:
header = <<-HTML
<div class="preview-content">
#{data["content"]}
</div>
HTML
p header
=> "<div class=\"preview-content\">\n<p>Far far away, behind the word mountains, far from the countries Vokalia and Consonantia, there live the blind texts. Separated they live in Bookmarksgrove right at the coast of the Semantics, a large language ocean. </p>\n</div>\n"
premailer = Premailer.new(header, with_html_string: true, adapter: :nokogiri,css: [Rails.root.join('app', 'assets', 'stylesheets', 'email_base.css').to_s], input_encoding: "UTF-8", verbose: true)
p premailer.processed_doc.to_html
=> "<!DOCTYPE html PUBLIC \"-//W3C//DTD HTML 4.0 Transitional//EN\" \"http://www.w3.org/TR/REC-html40/loose.dtd\">\n<html><body>\n<div class=\"preview-content\">\n<p>Far far away, behind the word mountains, far from the countries Vokalia and Consonantia, there live the blind texts. Separated they live in Bookmarksgrove right at the coast of the Semantics, a large language ocean.</p>\n</div>\n</body></html>\n"
premailer.doc.to_html returns the same thing with no inlined css.
I checked that the css file is accessible and that the styles apply to .preview-content p.
Adding a header to the document
header = <<-HTML
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta charset="utf-8"> <!-- utf-8 works for most cases -->
<meta name="viewport" content="width=device-width"> <!-- Forcing initial-scale shouldn't be necessary -->
<meta http-equiv="X-UA-Compatible" content="IE=edge"> <!-- Use the latest (edge) version of IE rendering engine -->
<title></title> <!-- The title tag shows in email notifications, like Android 4.4. -->
<link rel="stylesheet" href="/asset/email_base.css" media="all">
</head>
<body width="100%" height="100%" bgcolor="#ffffff" style="margin: 0; padding: 0 20px;">
<div class="preview-content">
#{data["content"]}
</div>
</body>
</html>
HTML
p header
=> '<!DOCTYPE html PUBLIC \"-//W3C//DTD XHTML 1.0 Transitional//EN\" \"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd\">\n <html xmlns=\"http://www.w3.org/1999/xhtml\">\n <head>\n <meta charset=\"utf-8\"> <!-- utf-8 works for most cases -->\n <meta name=\"viewport\" content=\"width=device-width\"> <!-- Forcing initial-scale shouldn't be necessary -->\n <meta http-equiv=\"X-UA-Compatible\" content=\"IE=edge\"> <!-- Use the latest (edge) version of IE rendering engine -->\n <title></title> <!-- The title tag shows in email notifications, like Android 4.4. -->\n <link rel=\"stylesheet\" href=\"/asset/email_base.css\" media=\"all\">\n </head>\n <body width=\"100%\" height=\"100%\" bgcolor=\"#ffffff\" style=\"margin: 0; padding: 0 20px;\">\n <div class=\"preview-content\">\n<p>Far far away, behind the word mountains, far from the countries Vokalia and Consonantia, there live the blind texts. Separated they live in Bookmarksgrove right at the coast of the Semantics, a large language ocean.</p></div>\n </body>\n </html>\n'
The desired css to be inline:
.the-excerpt,
.the-excerpt p,
.preview-content p
// +responsive-text(18px, 30px)
line-height: 1.8 !important
font-size: 18px
Is there something I'm missing to inline css manually? Both ways don't seem to yield any different results.
I'm trying out Premailer right now, and having some problems of my own.. but the way that i see Premailer actually processing the content and getting something different back (it removes the classes with the proper configuration setting, at least) is using this method:
premailer = Premailer.new(html, { :with_html_string=>true, :verbose=>true, :remove_classes=>true })
return premailer.to_inline_css
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"
If a user is on IE 7 and I read
<% = Request.Browser.Version %>
I get 7.0
if they have IE 9 and are on compatibility view, I get the same thing.
Is there anything in Request.Browser that can differentiate between a real IE7 user and a user that is using IE8 or IE9 but in compatibility mode?
It would be better to do this on the client side using JavaScript. You can use something like this:
http://code.google.com/p/ie6-upgrade-warning/
You can tweak it to whatever you want.
If your goal is simply to make sure the user is not in compatibility mode, then you can use either the meta tag or http header version of X-UA-COMPATIBLE:
<html>
<head>
<meta http-equiv="X-UA-Compatible" content="IE=Edge" >
</head>
<body>
<p>Content goes here.</p>
</body>
</html>
I am currently working on Classic ASP for one of my project. For non English languages I am getting boxes instead of special characters. I am rendering using UTF-8 but sometimes the characters goes to boxes. It comes back normal when I click refresh sometimes.
I followed all the steps below but i still get this problem
XML:
<xml version="1.0" encoding="UTF-8">
HTML:
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
content-type: text/html; charset=utf-8
Am I missing anything here? Thanks.
Add this to your page:
Response.CodePage = 65001
Response.CharSet = "utf-8"
It should display all correctly now.
Hope that helps
It's amazing BUT nobody gives a complete answer on what to do this PROPERLY... I hope this help somebody like me, because it was so hard to find the whole picture...
---------------- PREVIOUS CONSIDERATIONS --------------
FIRST, make sure IIS IS NOT replacing the Code Page... Go to IIS, click the Website, open ASP module, on Behavior it should be >> Code Page = 0
SECOND, The file itself should be checked, YES! the file... open your file explorer on windows (my computer), go to the folder where the files of your website are, take for example "default.asp", right click >> open with >> notepad THEN click on File >> Save As... IN THE DIALOG at the bottom says "Encoding", make sure it has UTF-8, otherwise you will have to add the
<meta http-equiv="content-type" content="text/html; charset=UTF-8"> in every page (including server side includes), which is not correct.
---------------- CORRECT STRUCTURE OF THE PAGE --------------
<%#LANGUAGE="VBSCRIPT" CODEPAGE="65001"%><%
Response.AddHeader "Content-Type", "text/html;charset=utf-8"
%><!-- #include virtual="/conexion.asp" -->
<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="utf-8">
</head>
<body>
áéíóú
</body>
</html>
It should work fine now with QueryStrings, Database and regular HTML... uffff
I need to be able to send the content type "text/xml" to Firefox and Safari, to allow them to render inline SVG in one of my pages.
This works, as long as the content type is "text/xml".
However, when IE hits the page, if the content type is not "text/html" it tries to render the XML document tree, rather than the XHTML content of the page.
What is the "right way" in ASP.NET MVC to set the HTTP Content-Type of ALL of my views?
Keep in mind that I am going to be rendering the views as ViewResults.
Ok, to clear any confusion up:
User Agent Content-Type Desired
-----------------------------------
IE 5.5 text/html
IE 6 text/html
IE 7 text/html
IE 8 text/html
Firefox text/xml
Safari text/xml
Chrome text/xml
And so on.
All of the browsers listed support SVG inline in some way or another. I have a consistent delivery format, save the content type.
You could look at the properties in Request.Browser and sniff out IE that way, and return the proper view that way, though that is prone to issues. This isn't optimal because IE might support it in the future.
public ActionResult MyAction() {
if (this.Request.Browser.Browser == "IE") {
return View("NonSVG");
} else {
return View("SVG");
}
}
Something worth looking into a little more might be this page on Codeplex. They define a property on Browser called AcceptsImageSVG, but it looks like it's geared towards mobile browsers, don't know if it could be used in your situation.
According to W3, you should be using application/xhtml+xml rather than text/xml to signify XHTML:
http://www.w3.org/TR/2002/NOTE-xhtml-media-types-20020801/#text-xml
The above article also notes that text/html should not be used for XHTML content.
You can determine the browser type by using the Request.Browser object
See this example http://msdn.microsoft.com/en-us/library/system.web.configuration.httpcapabilitiesbase.type%28VS.80%29.aspx
So you could do something like:
if( Request.Browser.Type.ToUpper().Contains("IE") )
{
// Return IE View
}
else
{
// Return the other view
}
Or, if you use this in lots of places you could create a ViewResult factory that returns the proper view result based on the browser type.
Kind of hacky, but... What if the SVG was in a frame, the frame advertised content-type=text/xml, while the containing page advertsized the more proper application/xhtml+xml. This divides the problem into two (possibly) more tractable ones.
I'm not sure whether this will work, but you could try using conditional comments:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<!--[if lte IE 8]>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<![endif]-->
<!--[if gt IE 8]>-->
<meta http-equiv="Content-Type" content="text/xml; charset=UTF-8" />
<!--<![endif]-->
<title>Test page</title>
</head>
<body>
<p>Test page</p>
</body>
</html>
Or, better yet, use HTML5:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<title>Test page</title>
</head>
<body>
<p>Test page</p>
</body>
</html>
You don't even need to specify the content type.