Issue with hyperlinks in HTML, CSS for Google Chrome browser

Question

I have created a website for a guesthouse. www.excelhome.co.in In it I have 4 hyperlinks in the menu bar and all of them works fine in the home page. But the same hyperlinks don't work in any other pages and this issue is only with Google chrome.

Below is the hyperlink code:

        a.one
           {
              color:#ddd;
                  text-decoration:none;
           }

        <td align="center"; style="width:10%;">
                 <a class="one"; href ="Index.htm">Home</a>
        </td>

With all other browsers all pages and links work fine.

Answer 1

Remove the semi-colon from within the a (anchor) element, it is invalid and may well be causing problems.

Looking through the source code and validation summary (see http://validator.w3.org/ ), the majority of errors are related to misplaced semicolons within element declarations. There are also a number of obsolete attributes used which should be replaced by CSS properties (either using an inline style attribute, or external stylesheet).

I only have a tablet with me at the moment, so can't inspect in more detail, but you certainly want to look into how you manage your layout - the twenty-four non-breaking spaces should probably be replaced with margin or padding for example.

Answer 2

You've covered the links up with a massive, positioned element with id="Layer1" . The clicks aren't reaching the links because they are being intercepted by it.

Absolute positioning is something that should be used with a very, very light touch.