One more way to show support to Ukraine and Ukrainians in their fight to maintain their independence, the right to live freely on their own land and to condemn the Russian aggression is to add a Ukraine themed cursor on your website. The cursor is an element that visitors on a desktop computer to your […]
Category: CSS
Solved: add icons in front of latest news widget news title links (Divi theme)
I am using Divi theme (for many of my projects). In it if for some case you would use the standard page layout with its sidebar, you will likely use widgets on the sidebar. If you happen to be like me, that you would like to display latest news in the WordPress latest news widget […]
CSS Trick: extend inner element over edges of container element
Sometimes you need to place an element inside another element (let’s say a div inside a div) and then extend the contained div over the edges of the container div. This needs to be done so that even if the container div has padding and/or margin set, the inner div still will overlap and extend […]
CSS: Make only first letter uppercase (capital letter), use ::first-letter
Ever needed to make only the first letter of a sentence, element or just a read more button uppercase and not the all words that are present in that element that the text-transform: capitalize; will do? Worry no more. Here is a simple answer. To make ONLY THE FIRST LETTER UPPERCASE with CSS in […]
CSS trick: div height to container height
Struggled the other day to find a solution to this problem My inner div needed to get the container div-s height and keep it when resizing the window size. Problem – it didn’t work. Setting the height: 100% just wouldn’t work. Solution to setting the inner div’s height to container div’s height You need […]
Solved: align like and tweet buttons in a row with CSS
When adding social buttons, more specifically Facebook like and Twitter tweet buttons to your site, sometimes you want to add them in a single row, left to right, side by side. When you paste the buttons’ code as is, they will remain a little bit misaligned. The solution to align like and tweet buttons […]
CSS background color transparency
Need to pick a color but with a little bit of transparency? No hassle, CSS3 is happily available for you to pursue the task of making the web a nicer looking place. Here’s the CSS code to give your div a half transparent background color: background-color: rgba(255,0,255,0.5); Change 0.5 from 0 to 1 to get […]
Change number of likes on a Like Button
Did you ever need to edit the number of likes that is present next to a like button? Did you know you can do that with CSS? If you really quickly need to have a like button with whatever count you want, go like this: 1. Take this like button code (you need to include […]
Rolling links with CSS (Webdesigner Depot style)
Ever noticed those fancy rolling links on Webdesigner Depot articles? It’s time to take that apart, how those links are created and share this valuable info about those rolling links to many many who all want to have those for themselves. Be notified, rolls don’t work on IE. Sadly. They’re very nice. Ok, add this […]
CSS Rounded Corners in IE (a cross-browser chat bubble)
You can style your div-s to have rounded corners. This is just a rounded container, works in all browsers including Internet Explorer. /* ROUNDED CONTAINER DIV CSS START*/ .rounded_container { -moz-border-radius: 15px; /* Mozilla Firefox*/ -webkit-border-radius: 15px; /* Google Chrome */ border-radius : 15px; /* Opera */ background: lightblue; border: 1px solid #ccc; padding: […]