Forum Moderators: open
<div style="position: absolute; width: 497px; height: 29px; z-index: 2; left: 240px; top: 1108px" id="layer2">
<p align="center">
<marquee direction="left" behavior="alternate" ><a href="http://example.com/feedback/" style="background: transparent;"><img src="images/cooltext422651925.png" onmouseover="this.src='images/cooltext422651925MouseOver.png';" onmouseout="this.src='images/cooltext422651925.png';" border="0" bordercolor="#000000" /></marquee>
It works fine, as it switches the picture every time the mouse goes over, but when I display it in Firefox it shows like 3 blue dots on the left side, and it does not show it in IE?!
I tried to play with the css file, but it did not work.
[edited by: tedster at 7:55 pm (utc) on May 19, 2009]
[edit reason] removed personal url [/edit]
Once your current problem is resolved, I suggest that you read up on what others think of <marquee> [webmasterworld.com]... you might be less than pleasantly surprised
The best place to start with cross-browser problems is to make sure you have valid mark-up. You can check that at the W3C:
W3C Validator - HTML [validator.w3.org]
W3C Validator - CSS [jigsaw.w3.org]
Trying to work out display problems in different browsers can be impossible if the code doesn't validate.
[It has all my format and positioning commands, it looks a bit messy, as I am using this moving title script, but it works fine]
I read the article about the marquee, but even if I take it off, firefox shows those blue dots, I think something with the image hyperlink)
I checked the validator before, but it gives me a lot of errors that I cannot change! like this moving title page, and some of the scripts.
If you guys think marquee is a bad idea, what do you recommend, to let the user click on it?
Thanks in advance,
I suspect that those three paragraphs are the source of your blue dots
Anyhoo...
As Tedster said:
The best place to start with cross-browser problems is to make sure you have valid mark-up
My suggestion is to strip everything back to the bare minimum, e.g
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html lang="en-GB">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>edit</title>
<link href="style.css" rel="stylesheet" type="text/css">
</head>
<body>
<h1>Hello World </h1>
<p> Lorem ipsum dolor sit amet, consectetuer adipiscing elit</p>
</body>
</html>
Get that to validate (HTML and CSS), then reintroduce one element/script/div/paragraph/etc at a time and re-validate at every step
If you can't validate your HTML and your CSS, you'll be wasting your time fighting a never-ending and (almost certainly) losing battle
I want to do what you recommended me, but I am not good with scripts of css, so I don't think it'd make any difference.
I am really sorry Tedster for posting my link, I will follow the rules from now on! ;)
I need to ask another question, if that's not against the rules, The original templates, was supposed to be one background, but after I added some text, the template was messed up, I include the code, as I cannot post the link anymore.
The original code, of the heading:
<!-- header -->
<div id="header">
<div id="logo"><a href="#">Website Name</a></div>
<div id="menu">
<ul>
<li><a href="#">home</a></li>
<li><a href="#">about us</a></li>
<li><a href="#">services</a></li>
<li><a href="#">pricing</a></li>
<li><a href="#">contacts</a></li>
</ul>
</div>
</div>
<!--end header -->
___________________________________________________________
--------------------------------------------------------------------
The one for my website:
<body>
<!-- header -->
<div id="header">
<div id="logo"><a href="#"><font color="#800000" face="Forte" size="7">
Buzz</font></a><div style="position: absolute; width: 574px; height: 72px; z-index: 1; left: 354px; top: 180px" id="layer1">
<p style="line-height: 100%"> </p>
<p style="line-height: 100%">
<font face="Forte" color="#000000" style="font-size: 25pt">Your
Last Stop For Files Conversions!</font></p>
<p> </div/>
</div>
<div id="menu">
<ul>
<li><a href="#"><font style="font-size: 11pt">Home</font></a></li>
<li><a href="#"><font style="font-size: 11pt">About us</font></a></li>
<li><a href="#"><font style="font-size: 11pt">Services</font></a></li>
<li><a href="#"><font style="font-size: 11pt">Pricing</font></a></li>
<li><a href="http://N/A/feedback"><font style="font-size: 11pt">Feedback</font></a></li>
</ul>
</div>
</div>
<!--end header -->
Thank you again for your help, [Please, mark the post as resolved]
