Hide div element after seconds
The element below will hide after 5 seconds automatically. If there is no element, refresh the page because then 5 seconds has probably already passed.
Page 2 of 14 - 67 posts
The element below will hide after 5 seconds automatically. If there is no element, refresh the page because then 5 seconds has probably already passed.
It's not hard to create a parallax scroll image with CSS. Just add background-attachment: fixed;
to it.
Scroll down to see the effect.
Here we have a list. It's not as straight forward as it seems to make the active list item be selected all the way to the left,
The trick is to use a pseudo element that spans all the way out.
Hover the icon below and it will be inverted to white. The trick is to use filter: invert(1);
.
<figure>
<img src="http://csspoo.com/assets/images/remixicons/link.svg">
</figure>
figure {
display: inline-block;
padding: 1rem;
background: #eee;
}
figure img {
filter: invert(1);
vertical-align: top;
}
figure:hover {
background: #000;
}
figure:hover img {
filter: invert(0);
}
The list numbers are automatically generated.
<ol>
<li>Primary 1
<ol>
<li>Sub 1</li>
<li>Sub 2</li>
</ol>
</li>
<li>Primary 2
<ol>
<li>Sub 1</li>
<li>Sub 2</li>
</ol>
</li>
</ol>
ol {
counter-reset: section;
list-style-type: none;
padding: 0;
}
li::before {
counter-increment: section;
content: counters(section, ".") " ";
color: #aaa;
width: 2rem;
display: inline-block;
}
Comments