I have a Razor layout MVC3 page as below:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<style "text/css">
</style>
</head>
After the word "style" and under the word text it is showing a syntax error that says: Element text is obsolete or nonstandard. Everything still works but I am just wondering why the error is showing. Not sure but I think it is coming from ReSharper. Prior to version 6 I don't recall seeing this message.
I think you missed the type.
<style type="text/css">
You missed the type.
<HEAD>
<STYLE type="text/css">
H1 {border-width: 1; border: solid; text-align: center}
</STYLE>
</HEAD>
See http://www.w3.org/TR/html4/present/styles.html#h-14.2.2
Related
I want to update an existing/simple holding page on my domain in html.
Unfortunately, I've noticed that this page doesn't seem to appear on newer browsers such as Chrome and Firefox and only seems to load up properly on Internet Explorer.
Is there any advice you could give me to help overcome this issue please?
Thanks
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>"TITLE HERE"</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>
<body style="background:ffffff url('LOGO.jpg') no-repeat center center">
</a>
</body>
</html>
<!--#easybanner4-->
To make a simple HTML page visible by most modern browsers it's better to use HTML5 so first, instead of using <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> just use <!DOCTYPE html>...
About your code, you can fix it by using something like this:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<!-- or <meta charset="iso-8859-1"> -->
<meta name="viewport" content="width=device-width">
<title>"TITLE HERE"</title>
<style>
body {
background:#ffffff url('LOGO.jpg') no-repeat center fixed;
}
</style>
</head>
<body>
link
</body>
</html>
I write this sample code on notepad for an html site with css but this won't work on Mozilla(version49.0.etc) while it does on IE, Chrome and Opera. If i start it on FF, debugger says "CSS has no errors" but it only display html code.
Someone know how to fix it?
Here there are the codes(html and CSS) of my site on local path:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
http://www.w3.org/TR/html4/loose.dtd>
<html lang="it">
<head>
<meta name="viewport" content="width=device-width">
<meta http-equiv="X-UA-Compatible" content="IE=edge" charset="iso-8859-1">
<title>Site</title>
<style type="text/css">
</style>
<link href="C:/Users/Dean/Desktop/Site/File/file1.css" rel="stylesheet" media="all">
</head>
<body class="sub">
<div class="alt">
<h1>Text here</h1>
</div>
</body>
</html>
And here there is the CSS file properties:
.sub{background-image:url("../image/bg.jpg");
background-repeat:no-repeat;
background-size:100% 100%;
background-attachment:fixed;
}
.alt {background-color:hotpink;
box-align:right;
border-radius:10px;
}
.set {font-size:12px;
color:white;
}
I'm assuming it is because your stylesheet is linked via the non standard file protocol (href="C:/Users/Dean/Desktop/Site/File/file1.css"). From my experience, Firefox usually complies to standards more than other browsers.
I'm assuming this is why your example works in other browsers, but not in FF. Try serving your stylesheet using an HTTP server.
<html>
<head>
<style>
#content input[type=text]
{
color: green;
}
</style>
</head>
<body>
<div id="content">
<input type="text" value="Some Text" />
</div>
</body>
</html>
Here's how it renders in FireFox (font is green):
Here's how it renders in Internet Explorer 7 (font is not green):
Update: Adding the DTD solved the issue, however when the input is set to disabled="disabled", IE7 still won't show the specified color.
You'll need to add a strict doctype for IE7 to support attribute selectors with a value.
http://msdn.microsoft.com/nl-nl/library/aa770069
Use a doctype like this, which is about as loose as you can get without breaking this functionality:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
Or rather use a more recent and more strict one, if you can.
You are running your site in Quirks mode. use the following doctype or similar
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
try this for starters <style type="text/css">
Try using quotes:
input[type="text"]
Alternatively, use a class and apply that class to all of your text inputs.
Maybe not what you wanted, but at least it works ;)
<html>
<head>
<style type="text/css">
.green {
color: green;
}
</style>
</head>
<body>
<div id="content">
<input type="text" class="green" value="Some Text" />
</div>
</body>
</html>
I have seen a tutorial on youtube which centers a site by giving margin: 0px auto; and by saying the actual width of the site:
body
{
align:center;
margin: 0px auto;
width: 1000px;
}
But this does not work for ie8. IS this a good idea to use in order to align to center the layout?
It works in IE6 and newer providing the browser is in standards mode. Trigger it with a Doctype such as:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
Since the alternative is quirks mode, and that creates many inconsistances with other browsers, standards mode is highly desirable.
So, yes that is a good method to centre things.
align:center;
That, on the other hand, is nonsense. There is no align property in CSS.
I have found the problem why this style and many other styles was not working for for ie8 (only for this browser). The problem is that I wrote
<html>
<head>
<title>About us</title>
<link href="css/about.css" rel="stylesheet" type="text/css" />
</head>
<body>
.......
Now I have changed it to:
<!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>
<title>About us</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link href="css/about.css" rel="stylesheet" type="text/css" />
</head>
<body>
When I added
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
line to the top of my html file, my css rules disappear in firefox. Also i can't see them with firebug.
Do you have any idea about this problem ?
Make sure that the files are sent by the server with the correct MIME type (text/css). Have a look in the error console ( IIRC the menu should be Tools / Error Console in the English version).
Usually, if the file ends with .css, this should happen automatically, however there are still badly configured servers around. If you are using a Apache web server, you may be able to correct this with a .htaccess file, otherwise you'll need to ask your support.
Details: https://developer.mozilla.org/en/incorrect_mime_type_for_css_files
You need to add attributes to your start-html tag to get it right. This is done since XHTML really is XML.
<!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" xml:lang="en" lang="en">
<head>
<link href="style.css" rel="stylesheet" type="text/css" />
</head>
<body>
...
</body>
</html>
The code above suggest you to have the style.css file in the root-catalog of your website.
Please check it
http://www.w3schools.com/tags/tag_doctype.asp
i think you have more idea of doctype
<!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 http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<style type="text/css">
html, body {
padding:0;
margin:0;
height:100%;
}
#wrap {
background:red;
height:100%;
overflow:hidden;
}
#right {
background:blue;
float:left;
width:30%;
height:100%;
}
#left {
background:yellow;
float:left;
width:70%;
height:100%;
}
</style>
</head>
<body>
<div id="wrap">
<div id="left"> Content </div>
<div id="right"> Side Content </div>
</div>
</body>
</html>