Hi all,

i have a problem with one of my web pages.It has a link to another page and when you place the mouse over the link to click it, it jumps in and out (left to right).

The best way to describe it is see it.

http://dfwcomputer.tripod.com/

click on products on the left and then try to click "Click Here" in the middle of the page.

I am using Firefox since version 0.8 i think and am currently using v1.5
It also does not seem to happen in I.E.

Thanks
Dean

I'm not 100% certain, but I think it may just be the font-weight:bold you're applying to the hover. I know it sees minor, but it does make the text slightly larger which could be throwing things off if your widths are really tight.

When I took the bold off the hover it didn't seem to be moving around for me. Easy enough to test and see if that's the problem.

Originally Posted by vangogh

I'm not 100% certain, but I think it may just be the font-weight:bold you're applying to the hover.

Thanks for the reply but i couldn't find any bolding that had been applied.Thanks all the same but would never have thought of that.

What i did find was;

<td colspan="3">
<table width="100%" class="Border-0px" cellpadding="0" 
cellspacing="0" style="border-collapse: collapse">

Do you know if "border-collapse: collapse" is supported in firefox.This seems to something to do with it i think.

Is there some sort of guidelines as to what is supported and what is not, as the page displays as "Valid xhtml".One would of thought that tags that are not compatible with certain browsers would render the page "non-valid xhtml".

Just guessing here of course.

Below is a link to the full source code.

Thanks
Dean

Vangogh is right... on main.css instead of

a:link {
    color: #0033FF;
    text-decoration: none;
}
a:visited {
    color: #0033FF;
    text-decoration: none;
}
a:hover {
    font-weight: bold;
    color: #0033FF;
    text-decoration: underline;

use this

a:link {
    color: #0033FF;
    text-decoration: none;
}
a:visited {
    color: #0033FF;
    text-decoration: none;
}
a:hover {
    color: #0033FF;
    text-decoration: underline;

font-weight: bold; on the hover is making it bold, which makes it move.

Hope This Helps

I was also going to ask if the css was messed up. I have had the same problem that my hover would be in bold, and being that my words were long, as they were put into bold, they would bounce into the next line and mess everything.

Nice catch everyone

The reason is that must have defined in your style sheet that on mouseover the font is made to be bold. That is undoubtably your problem.

That fixed the problem... forgot about style sheet.


Thanks vangogh you were right, much appreciated.

Also thanks silent77

Problem Resolved

Dean

Glad to help. Here's a css reference with browser support from W3Schools. There are probably better ones, but all I seemed to be finding now were out of date support charts.

Much appreciated

Thanks

I seem to be attracting problems (guess I’m just good )

I have another problem I’ll keep posting here as it's the same website.

On the services page I have >Top links so that you can instantly go to top of page. In firefox when you click on them the page shrinks right down. It is as if the borders just collapse. Any ideas would be greatly appreciated.

Also it is only in firefox that it happens.

I don't know - unless the floats are messing it up. You don't need float: right to align text to the right. Using text-align: right; should be suffencient, but I'm unsure if that will solve your problem.

Might help if you gave us the CSS to go with it.
I use the "top" method on several things and I've never seen this behavior. Doesn't appear to be in the HTML that I can see, so it has to have something to do with the CSS being used.

BTW.. here's a better way to make semantic anchors:
http://bitesizestandards.com/bites/c...mantic-anchors

I have included the CSS as requested.

Originally Posted by LadynRed

BTW.. here's a better way to make semantic anchors:
http://bitesizestandards.com/bites/c...mantic-anchors

Thanks i will check it out.

i will also try the text-align right as suggested

Ok, I've been playing around with your files. This is one of the weirder things I've seen and haven't found the answer yet.

You definitely need to do some code cleanup. Get those styles into your external stylesheet, dump the tables, dump the <font> and other deprecated tags, and use the CSS to control spacing so you can get rid of all those <br>'s. All your text needs to be inside <p> tags too.

If I can figure this out, I'll post back.