Member Avatar for centraldrugs

Step one is fix current site before redesign:
www.anypharmacy.com
- Someone else created the site and it is a total mess that I must fix asap
I'm so overwhelmed with it!

Can anyone view page source and point me to what is causing the menu to be overlapped by other text and images? Maybe once I can see that the rest will ge easier... Is it just me or is it ridiculously sloppy?

  • 3 Contributors
  • 4 Replies
  • 121 Views
  • 3 Days Discussion Span
  • Latest Post Latest Post by ccube921

Dani AI

Generated

Quick, practical diagnosis and a patch.

Most overlap problems come from stacking context and positioning, or from an embedded plugin that sits above HTML. For the fastest way to confirm which it is: open the browser dev tools (F12), inspect the nav element, then temporarily hide the image/phone/embed that’s covering it. If hiding it reveals the nav and makes links clickable, it’s a stacking/position issue. If hiding it does nothing, it’s likely a plugin/object that doesn’t obey z-index.

A small, non-destructive test you can apply right away (add in a stylesheet or live in dev tools):

/* quick test: bring the nav above everything */
#topnav {
  position: relative; /* must be positioned for z-index to work */
  z-index: 9999;
}

If that shows the nav, the permanent fix is to identify which parent is creating its own stacking context (position, transform, opacity < 1, filters, a z-index on a positioned ancestor, etc.) and either remove/adjust that or move the nav out of that container. Read about how z-index and stacking contexts work at MDN — z-index.

If the culprit is a plugin/video element, replace it with an HTML5 <video> or remove the object to test, because some plugin embeds are rendered above the page regardless of z-index. After the quick patch, clean up inline styles and deprecated tags, and run the markup and stylesheet through the validators at W3C Markup Validator and W3C CSS Validator before refactoring. was right that a rebuild or clean template will save time; ’s push to learn CSS is spot-on — but the above will buy you time to refactor safely.

Recommended Answers

All 4 Replies

Member Avatar for hughv

It looks OK to me in FF and IE7 except for the centering in the Diabetes Center.

Member Avatar for centraldrugs

Hi,

Really? I'm looking in IE7 and FF as well but the nav menu on top is blocked by the center image and the phone number in the top left corner on the homepage. If you click on "professionals", on that page and some others, you can see it is revealed but still not clickable. It also says there are missing plugins but I'm not sure if that is because of the video that should be on there or something else... I'm looking at it on a widescreen but I don't think that would have anything to do with it...

Member Avatar for hughv

I see what you mean. The menu is so blocked I didn't even know it was there.
This is a very weird mix of HTMl and CSS that even includes some <Font> tags, inline styles, external styles, and image maps. Not to mention a .wmv file that needs a plugin(WTF?).
The W3C validator indicates 94 errors, for what that's worth, and the CSS validator just goes on and on.
I'd find a nice template and start over.

Member Avatar for ccube921

1st thing: LEARN CSS
then you will be neater and menus will work so much better, then, get a new template and do it all over again

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.