Details-Polyfill | Crossbrowser Polyfill for HTML5 details element | User Interface library
kandi X-RAY | Details-Polyfill Summary
kandi X-RAY | Details-Polyfill Summary
Crossbrowser Polyfill for HTML5
Support
Quality
Security
License
Reuse
Top functions reviewed by kandi - BETA
Currently covering the most popular Java, JavaScript and Python libraries. See a Sample of Details-Polyfill
Details-Polyfill Key Features
Details-Polyfill Examples and Code Snippets
Community Discussions
Trending Discussions on Details-Polyfill
QUESTION
I'm trying to build a responsive and accessible navigation. To do so, I'm using
for subpage navigation.
I started out using the linked example and edited the code to my needs.
I played around with it for a while and have the mobile version as needed. However, I'm running into a problem with the positioning of the dropdowns in the non-mobile version.
In the linked example, the dropdowns appear directly under the respective parent item. As far as I can see, this is achieved by using position: absolute
.
When trying this in my adapted version, the dropdown moves to the upper left corner of the navigation bar.
If I change the positioning, the items are aligned correctly, however, they don't appear as a dropwdown but rather as new lines. Thereby, they move the whole navigation bar.
Can someone spot where my mistake lies?
I've added all code below. I haven't changed anything in the javascript and just added it here so running the code snippet will actually reproduce the problem.
Thanks a lot for any help in advance!
...ANSWER
Answered 2020-May-05 at 13:04After some trying around, I realised I was pretty close to the answer.
To reset the position of the two dropdowns, all that was needed was to add left: auto;
and right: auto;
as additional attributes for #sitenav.large ul ul
Community Discussions, Code Snippets contain sources that include Stack Exchange Network
Vulnerabilities
No vulnerabilities reported
Install Details-Polyfill
Support
Reuse Trending Solutions
Find, review, and download reusable Libraries, Code Snippets, Cloud APIs from over 650 million Knowledge Items
Find more librariesStay Updated
Subscribe to our newsletter for trending solutions and developer bootcamps
Share this Page