...

View Full Version : Different colour header text in Opera and Firefox



effpeetee
05-13-2007, 10:59 AM
Thank you for looking here but I have now found the problem.

No action needed,

effpeetee


Hi there!

I get a different colour header with Opera than with IE.

The Welcome header is supposed to be Red, but is white in Opera.

Is there a work around for this.

Thanks in advance.

effpeetee

www.exitfegs.co.uk

_Aerospace_Eng_
05-13-2007, 05:42 PM
What was the solution?

effpeetee
05-13-2007, 08:40 PM
It was the "Good Morning etc-" Greeting on the index page that was giving trouble.

Although the color was set for text style H1 - color:red

<style type="text/css">
h1,h2 {font-family: Arial;}
h1 {color:red}
h2,h3 {color:cyan}
h6 {color:cyan}
h4,h5 {color:white}
h6,h5,h4,h3,h2,h1 {
margin: 0;
}

</style>


I had to add it again, immediately before the print command., in orde to get red text on Firefox and Opera.

#greet{color:red;}
</style>


<script type="text/javascript">

function greet() {
var todaydate = new Date();
var timeis = todaydate.getTime();
todaydate.setTime(timeis);
var houris = todaydate.getHours();
if (houris >17) display = "Evening";
else if (houris >11) display = "Afternoon";
else display = "Morning";
var title = document.title;
var welcome = ("Good " + display + ". Welcome to the Taylor Website");
document.write(welcome);
}
-->
</script>

I do not understand why. I just tried several things to get what I needed.

This worked.
My knowledge of CSS is very rudimentary at present.

effpeetee

www.exitfegs.co.uk

_Aerospace_Eng_
05-13-2007, 11:03 PM
Hmm I think you need to work on your HTML a bit more before you try doing more CSS. Your code has quite a few errors. 73 to be exact. See them here (http://validator.w3.org/check?verbose=1&uri=http%3A%2F%2Fwww.exitfegs.co.uk%2F).

effpeetee
05-14-2007, 07:21 AM
Yes, I know that my knowledge of XHTML is very basic and I am grateful for your help.
I have validated the index page using CSE HTML Validator v8.0 and have removed all the actual errors.

However, I do have warnings about the <h4>'s in the menu hyperlinks.
As it works and I do not know how to do it differently, I shall have to leave it as it is at present.

The present version has another anomoly. The Opera version shows bullets on the menu, Firefox and IE do not. The bullets shown on Opera are not correctly lined up either. I have no idea why.

Ah well! Press on regardless. Always grateful for your help.

effpeetee

www.exitfegs.co.uk

Bill Posters
05-14-2007, 08:28 AM
I have validated the index page using CSE HTML Validator v8.0 and have removed all the actual errors.
Sorry, but a quick check of the index page shows that yo've still some way to go (64 errors) (http://validator.w3.org/check?verbose=1&ss=1&uri=http%3A%2F%2Fwww.exitfegs.co.uk%2F).


However, I do have warnings about the <h4>'s in the menu hyperlinks.
As it works and I do not know how to do it differently, I shall have to leave it as it is at present.


<div id="links">
<ul>
<li><a href="two.html"><h5>Betty and Frank.</h5></a></li>

As mentioned in one of your earlier threads (http://www.codingforums.com/showthread.php?t=113718), you can't have a block-level element (e.g. h4, h5) nested inside an inline-level element (e.g. a [anchor])

Also as mentioned, your use of the heading elements in your menu are not only wrong, but also likely to cause trouble with search engines.
It appears that you've already added CSS to embolden the text in the menu (as recommended in the other thread), so there's no need for the heading elements.

i.e.

<div id="links">
<ul>
<li><a href="two.html">Betty and Frank.</a></li>



The present version has another anomoly. The Opera version shows bullets on the menu, Firefox and IE do not. The bullets shown on Opera are not correctly lined up either. I have no idea why.
Fwiw, it appears without bullets in Op9/Mac.

effpeetee
05-14-2007, 09:44 AM
www.exitfegs.co.uk

This is the best that I can do.

effpeetee

Bill Posters
05-14-2007, 10:42 AM
Add a meta character encoding meta element and you'll get a clean bill of health from the validator.

e.g.

<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>You might also want to do something more informative with your title</title>



</head>


You're still using heading elements inappropriately, the code snippet below being a good example.

<h5>Website Builder - Frank Taylor<br />
Assisted by "Coding Forums".<br />
Checked with IE 7, <br />Firefox 2.0.0.3 <br />and Opera 9.2.<br />
Set to:- 1024 x 768 pixels.<br /></h5>
(It might be a good idea to remove any double spaces in your tags, e.g. some of the <br /> tags above. It shouldn't create a problem, but it's best to be on the safe side.

Other than that, you've done quite a good job. :)


There are possibly a couple more things you could consider as a next step, such as making sure the page 'works' without javascript and how to make better use of js to handle the greeting and the changing of the image (instead of a meta refresh + random image onload script), but that's entirely down to how much of a 'perfectionist' you are. ;)

effpeetee
05-14-2007, 11:18 AM
Thanks for your winning suggestions.
As British Rail USED to say - "We're getting there!"

Now for the other pages.
200 pages without a doctype.

Whew!

effpeetee

Bill Posters
05-14-2007, 12:50 PM
Now might be an opportune time to take a look into PHP functions such as include().
PHP can help modularise a page, making site-wide updates and changes a far simpler affair than dealing with high numbers of individual pages.

You've said before that you like a challenge, so I'd recommend bending your head around some basic PHP as your next step - before you attempt to 'correct' 200 pages manually.

Even a basic understanding of PHP can revolutionise the way you build sites.
So, it's better to change those 200 pages once to integrate PHP, than to condemn yourself to forever changing 200 pages each time something significant changes on your site.

It can even be used to make more mundane tasks such as randomising the picture on the homepage more robust.
(You're still advised to use js as the means to periodically change the image, but at least, with PHP, the index page will still present a random image each time the page loads, even without js.)

effpeetee
05-14-2007, 01:05 PM
Sorry for the header.

How do I start the quest? It's a new thing for me.
A book, or a site perhaps. Sounds interesting.

effpeetee

www.exitfegs.co.uk

Bill Posters
05-14-2007, 01:33 PM
The W3Schools.com site (http://www.w3schools.com/php/php_intro.asp)* is as good a place as any to start.
(* not a part of, or affiliated to, the W3C)

You might also find this useful…
http://www.phpvideotutorials.com/

Good for starting out, bookwise…

I can vouch for the helpfullness/usefullness of PHP for the World Wide Web. It's one of the Visual Quickstart range which I've always regarded as a very good set of intro books.

PHP in Easy Steps is also a good starter book.

PHP by Example and Essential PHP for Web Professionals can both provide a good next step once you've go the very basics down (though all of the books cover the basics to a greater or lesser extent).
Their delivery is a little drier than the first two titles, but both offer step-by-step tutorials on a slightly more developed range of tasks.
Of the two, Essential PHP… is the better book as it's presentation is slightly more friendly.

A good, follow-on title is Advanced PHP for Web Professionals.

All those books helped me to take steps into PHP. The two beginner books were especially helpful in easing the learning curve.

Try before you buy by grabbing copies via your local library.
Worked for me.

VIPStephan
05-14-2007, 01:43 PM
Also, well I don’t know exactly how it works in other editors but Dreamweaver has quite a good search and replace function where you could search for the <html> tag and replace it with, e.g. <!DOCTYPE …><html> in all files of your site. This will take some seconds and you’ve updated 200+ pages.

Whether you can do this or not depends on how good the HTML editor is.



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum