Member Avatar for Proglearner

My draft webpage currently has a <head> but no <body>. It links to a css stylesheet that exists in the expected location but is currently blank. When I loaded it into Firefox 17.0.1 for Win XP, the error console returned these three messages:

Could not read chrome manifest 'file:///C:/Program%20Files/Mozilla%20Firefox/extensions/%7B972ce4c6-7e08-4474-a285-3208198ce6fd%7D/chrome.manifest'.

Timestamp: 07/01/2013 4:26:25 PM
Warning: XUL box for _moz_generated_content_after element contained an inline #text child, forcing all its children to be wrapped in a block.
Source File: chrome://browser/content/browser.xul
Line: 0

Direct3D 9 DeviceManager Initialized Succesfully.
Driver: nv4_disp.dll
Description: NVIDIA GeForce 8400GS
Version: 6.14.13.681

Can someone help me interpret the messages so I understand what they mean?

Progz

  • 3 Contributors
  • 8 Replies
  • 169 Views
  • 6 Hours Discussion Span
  • Latest Post Latest Post by LastMitch
Member Avatar for Proglearner

I read the bug discussion and it makes Mozilla sound like some sleepy-eyed bureaucracy. What I'll probably do is abandon Firefox and switch to Chrome as my Windows browser. In Linux I'll just find a non-Mozilla browser to use. I'm really, really disappointed in what I just read through the link trail you provided me. But at least it's not a problem with my code, just with organizational ossification, which the open-source community doesn't appear to be immune from.

I had been a big fan of the open-source concept but am starting to wonder whether it has lost its way. This isn't the first time I've found some troubling occurrences within open-source subcommunities.

Member Avatar for LastMitch

@Proglearner

need help interpreting error messages

Can you post your code? Including the CSS code that included this: element contained an inline #text child.

Member Avatar for LastMitch

@Proglearner

This isn't the first time I've found some troubling occurrences within open-source subcommunities.

You have to understand some CSS code won't work correctly in some browser you need to find a way to adapt to it.

Edited by LastMitch because: grammer
Member Avatar for Proglearner

Sure, I'll post the code. In fact, I'll just upload it. (The image file is missing from this upload and I wasn't allowed to upload a .css file so it's a .txt copy).

body {
	background-color: #2f4f4f;
}

h1 {
	font-family: cursive;
	font-size: 2.5em;
	color: #ff8c00;
	background-color: #fff8dc;
	margin: auto;
	text-align: center;
	border: 1px solid black;
	border-radius: 12px;
	padding-bottom: 7px;
	margin-bottom: 35px;
	
}

h3 {
	font-family: cursive;
	font-size: 2em;
	color: #ff8c00;
	background-color: #fff8dc;
	margin: auto;
	text-align: center;
	border: 1px solid black;
	border-radius: 12px;
	padding-bottom: 7px;
}

p {
	font-family: sans-serif;
	font-size: 1.2em;
	color: yellow;
	text-align: left;
	border: 1px solid white;
	border-radius: 8px;
	padding: 4px;
	margin-bottom: 35px;
}

img {
	height: 200px;
	width: 100%;
	margin: auto;
	text-align: center;
	border: 1px solid black;
	border-radius: 30px;
}

div {
	color: orange;
	font-family: cursive;
	font-size: 0.8em;
}

p div {
	color: black;
	font-family:cursive;
	font-size: 1.2em;
}
<!DOCTYPE html>
	<html lang="en">
		<head>
			<meta charset="utf-8">
			<title>Eyetee's Coding and Creativity Site</title>
			<meta name="keywords" content="Miki-Kocic, Eyetee, IT, computer, website, webdesign, design,
				writing, creative-writing, fiction, story, stories, short-story, short-stories, html, 
				css, programming, javascript, computer-code, game, app, apps" />
			<meta name="description" content="Javascript games, short stories and more" />
			<meta name="author" content="Miki Kocic" />
			<link type="text/css" rel="stylesheet" href="stylesheet.css" />
		</head>

		<body>
			<h1>Coding and Creativity Plans and Dreams</h1>

			<img src="webimage.png" />

			<p>Welcome to the humble website of a retired middle-aged fellow who passes the time learning
			   programming and writing fiction. This website will eventually feature Javascript games,
			   downloadable Python programs, short stories and poems, as well as other pleasant things.
			   Right now it's somewhat under construction as I get my coding skills up to speed. The
			   following is a summary of my plans for the website and a little bit about me.</p>

			<h3>Website Design</h3>

			<p>I am teaching myself HTML and CSS. So far, I've learned enough to design this webpage using 
			   only a text editor rather than any graphical tools. I am hoping to take
			   advantage of the power and versatility of from-scratch website design to make superior
			   webpages you can't make with the graphical tools normally available for download or provided
			   by a webhost. <strong><em>Automation is limitation.</em></strong> Anyone who uses a graphical 
			   design tool will necessarily be limited in what she can do. I want to transcend those limits. 
			   My shortfall in visual creativity will be an obstacle, since all my creativity has to do with 
			   words, but I'm hoping to run into visually talented people with their own shortfall in 
			   technical knowledge who will want my help in making their vision of a website come alive.</p>

			<h3>Other Programming</h3>

			<p>I'm also teaching myself Javascript and Python. So far, I've written <em>The Extremely Long
			   Compliance Quiz (TELCOQ)</em>, which takes <strong>f.o.r.e.v.e.r.</strong> to tell you whether 
			   you're any good at following instructions, and am working on <em>Eyetee's One-Handed Blackjack 
			   Game (EOBLAG)</em>, which you should avoid if one-handed play is against your religion. Those 
			   will be available eventually as Javascript games you can play right on this website, and later 
			   as Python games you can download to your device. There are other programs in the works, 
			   including the star of the show, <em>Eyetee's Spiritual Journey (EYSPIJ)</em>, which has some 
			   commercial possibilities and will take some time to get off the ground. Stay tuned.</p>



<div>This website and all and any parts thereof are copyright &copy2013 by Miki Kocic. All rights reserved.</div>
Member Avatar for LastMitch

@Proglearner

Sure, I'll post the code. In fact, I'll just upload it.

I assume you are using HTML5? Most function doesn't work well on some browsers.

First of all you didn't put a close </body> </html> on the bottom of your code.

So this is your code that I edit a little:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Eyetee's Coding and Creativity Site</title>
<meta name="keywords" content="Miki-Kocic, Eyetee, IT, computer, website, webdesign, design, writing, creative-writing, fiction, story, stories, short-story, short-stories, html, 
css, programming, javascript, computer-code, game, app, apps" />
<meta name="description" content="Javascript games, short stories and more" />
<meta name="author" content="Miki Kocic" />
<link type="text/css" rel="stylesheet" href="stylesheet.css" />
</head>
<body>
<h1>Coding and Creativity Plans and Dreams</h1>
<img src="webimage.png" />
<p></p>
<h3></h3>
<p></p>
<h3></h3>
<p></p>
<div></div>
</body>
</html>

Second your CSS doesn't have this @charset "UTF-8"; .There's nothing wrong with your CSS code at all maybe this p div I never seen that one but since you are HTML5 you need to put @charset "UTF-8"; on top of your CSS

Read it more here:

https://developer.mozilla.org/en-US/docs/CSS/@charset

This is your CSS

@charset "UTF-8";
body {background-color: #2f4f4f;}
h1 {font-family: cursive;font-size: 2.5em;color: #ff8c00;background-color: #fff8dc;margin: auto;text-align: center;border: 1px solid black;border-radius: 12px;padding-bottom: 7px; margin-bottom: 35px;}
h3 {font-family: cursive;font-size: 2em;color: #ff8c00;background-color: #fff8dc;margin: auto;text-align: center;border: 1px solid black;border-radius: 12px;padding-bottom: 7px;}
p {font-family: sans-serif;font-size: 1.2em;color: yellow;text-align: left;border: 1px solid white;border-radius: 8px;padding: 4px;margin-bottom: 35px;}
img {height: 200px;width: 100%;margin: auto;text-align: center;border: 1px solid black;border-radius: 30px;}
div {color: orange;font-family: cursive;font-size: 0.8em;}
p div {color: black;font-family:cursive;font-size: 1.2em;}
Member Avatar for Proglearner

If most html 5 functions don't work well in some browsers, should I be using html 4.01 instead? It wouldn't be that difficult to recode the webpage to comply with 4.01.

The webpage isn't finished and I simply forgot to put in the closing body and html tags ahead of time, but thanks for the reminder.

The p div needs to be deleted because it was something I tried in order to use a <div> tag nested within a <p> tag in order to change text style through the separate stylesheet instead of using html tags within the text. I'll get rid of it.

Thanks very much. Solved.

Member Avatar for LastMitch

If most html 5 functions don't work well in some browsers, should I be using html 4.01 instead? It wouldn't be that difficult to recode the webpage to comply with 4.01.

No, you can still used <!DOCTYPE html> for most CSS code too. As long you remember which CSS code can be used in <!DOCTYPE html>. Some CSS3 won't comply well in certain browsers so that's why you can mixed it up as long you can find a common ground for a certain CSS code then there shouldn't be any issue.

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.