Tagged: 

Viewing 7 posts - 1 through 7 (of 7 total)
  • Author
    Posts
  • November 20, 2024 at 7:31 pm #1471792
    NicomIT

    I have a number of accordions on the page linked below. Each of them has a ID set to them so you can click on the associated link at the top of the page to jump down to the accordion with the terms that are from that letter of the alphabet. All of them work fine, except for the one for “S”. The letter “S” is displaying overlapping the accordion and there is a gap between the first and second items in the accordion. Clicking on the first item in the accordion doesn’t open it, bur instead takes you back to the top of the page. Clicking on “S” at the top of the page does the same thing, instead of jumping down the page to the area where the ID is placed.

    All the other accordions, links and IDs are set-up the same and work fine. So I don’t know why there is a problem with this one. Any help would be great. Thanks.

    November 21, 2024 at 12:54 pm #1471836
    Rikard

    Hey NicomIT,

    Please send us a temporary WordPress admin login and login URL so that we can have a closer look. You can post the details in the Private Content section of your reply.

    Best regards,
    Rikard

    November 22, 2024 at 6:35 pm #1471971
    NicomIT

    Hi Rikard,
    I’m not able to provide you login info for the live website, but can for our staging copy of the website.

    I created a version of the page there and added the links across the top that would jump down to the accordion for the letters in the alphabet. Since it was the “S” header and accordion that was having the issue, I just added those to this page and nor all the other accordions. I’m seeing the same issue here. I have no idea why we would just see this happen for “S”, but at least the issue is consistent.

    Below is the info you would need for the staging website.

    Thanks!

    November 23, 2024 at 1:30 pm #1472008
    Rikard

    Hi,

    Thanks for that. You had added s as an ID to the first toggle, removing it fixed the problem. Please review your site.

    Best regards,
    Rikard

    November 25, 2024 at 3:30 pm #1472155
    NicomIT

    Hi Rikard,
    We had the ID added to the first toggle so it would open when someone clicked “S” at the top of the page and jumped down to that area. We also have the ID applied to the “S” that is displayed above the accordion.

    I added another header and accordion for “T” below what we have been looking at for “S” and that works with no issues. It has the ID set for the “T” header as well as the first toggle. You can also see the “S” is not displaying correctly with the ID applied to it and is overlapping the accordion slightly. I’m not sure why, but it looks like the issue has something to do with using the ID with the name of “s”. But I have no idea why.

    Ryan

    November 25, 2024 at 3:51 pm #1472157
    NicomIT

    Update – I tried naming the IDs “item-a”, “item-b”, etc. instead of just “a”, “b”, etc. That seemed to work on the live website and everything is displaying/linking fine. I’m not sure why using “s” for one of the IDs was an issue, but this seems to work to get around it.

    November 25, 2024 at 5:03 pm #1472164
    Rikard

    Hi,

    Great, I’m glad that that you found a solution. Note that a page can only have a single element with a specific ID, assigning the same ID to more than one element does not work.

    Best regards,
    Rikard

  • Author
    Posts
Viewing 7 posts - 1 through 7 (of 7 total)
  • You must be logged in to reply to this topic.