I have a wordpress website with this free theme: https://wordpress.org/themes/minimal-grid/
I'm seeing some unusual behaviour, which isn't a problem and I can fix by removing the element, but I don't know why it's happening and would like to understand it.
At the end of each post, there is a link to the previous and next post. When I hover over these, the background of the element darkens slightly. Where there is an image as background, it doesn't disappear, just darkens. Here's a page that demonstrates: https://5diraptor.com/todoist-task-project-manager/
The unusual part is there doesn't seem to be any :hover
selectors which actually tells it to do this, so I'd like to understand why it's happening. Below is the HTML:
<nav class="navigation post-navigation" role="navigation" aria-label="Posts">
<h2 class="screen-reader-text">Post navigation</h2>
<div class="nav-links">
<div class="nav-previous">
<a href="https://5diraptor.com/vivaldi-browser/" rel="prev">
::before
<span class="meta-nav" aria-hidden="true">Previous</span>
<span class="screen-reader-text">Previous post:</span>
<span class="post-title">Vivaldi Browser</span>
</a>
</div>
<div class="nav-next">
<a href="https://5diraptor.com/wordpress-development/" rel="next">
::before
<span class="meta-nav" aria-hidden="true">Next</span>
<span class="screen-reader-text">Next post:</span>
<span class="post-title">WordPress Development</span>
</a>
</div>
</div>
</nav>
There's no:hover selectors on any of these elements which change background color. However, when I remove the ::before
elements in Chrome Dev tools, the hover transition no longer happens.
What I don't understand is there's no :hover
selector on the ::before
pseudo-element, and there's no color related CSS applied to this - see screenshot. There's also no event listeners for mouseover
so I'm pretty sure this isn't Javascript.
I can't force element state to hover for pseudo-elements so I'm not sure how to debug this any further. Can anyone help me understand why this is happening?
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.