Links in footer only clickable on one/two page(s)

Hi! I recently created an ecommerce site, and am having problems with the footer. The links are clickable only on the pages ‘About Us’ and ‘Contact Us’, but not for the other pages. My coding was super basic for it so I’ve no idea what’s wrong with it.

<div align="center">
<a href="http://xojaynee.tictail.com/contact-us">Contact Us</a> | 
<a href="https://carousell.com/xojaynee/">Carousell</a>
</div>

Here’s the link to my site if it helps.

I can see the footer on all the pages I looked at except the order form page - IE11

On some pages the footer is high as the page itself has very little content and so is short.

The links are there, but they are not clickable. That is because they are covered by other elements.
The problem is that your list items have absolute positioning, this takes them out of the natural flow of the page. It is the bottom margin that covers the links.
I think you need to re-think your layout methods. Absolute positioning should not be used for positioning major page elements. It’s best to let elements follow the natural page flow, one after the next.

1 Like

Welcome to the forums, @xojaynee.

Which browser/OS are you seeing this problem in? I’m seeing the links on every page I’ve tried, using Firefox. (The link text is very pale and hard to read against the white background, but that’s a separate issue. I recommend this tool to check colour contrast: http://webaim.org/resources/contrastchecker/)

1 Like

A quick fix is to give the footer a bit of margin-top so it will clear the overlapping margins of the list.
But in the longer term, you should re-think your layout. That kind of “rigid” layout with absolute positioning is quite dated, fragile and not compatible with the wide variety devices that people use to access the internet today.

3 Likes

Yes, I think I phrased my question wrongly - the links are viewable but they aren’t clickable. Sorry about it, very new to this :sweat_smile:

I’m actually using one of the available Tictail templates and customising it… is there a way to change the absolute positioning without getting rid of the entire layout?

1 Like

I phrased my question wrongly - the links can be seen but they are not clickable. I tried accessing the site with Safari and Chrome and both don’t work.

Thank you for the suggestion about the tool - will try it out :slight_smile:

1 Like

They are clickable with JavaScript disabled, so your positioning problems are coming from the JavaScript.

They are clickable for me once I click to get rid of the currency overlay message.

I think something has changed. Now when I look, the links are clickable even with the currency overlay. But when I looked this morning, the ul was overlapping them with the li bottom margin.

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.