Tag: CSS

Introduction to Browser Development Tools

All modern desktop browsers now have integrated browser tools, however, there are subtle (and sometimes less subtle) differences between each. I find that Firefox has the best overall, though I do switch to Chrome for some specific debugging tasks. I personally only use Edge or Safari when trying to isolate a bug that only shows… Read More

Responsive Font Sizes & Title Bars

Let’s say we want a reall big, chunky main title for our forum skin. Here’s, I think, the simplest way to do it, I see this a lot: .maintitle { height: 160px; line-height: 160px; text-align: center; font-size: 40px; } If we add that to the stylesheet and check it on desktop, it looks great. That… Read More

Using SVG Filters in CSS

Firstly, you’ll need the svg itself. Three things to note: 1: Like empty images, empty svgs still take up some minimum space by default. If you’re borrowing a filter from an svg image that you’re actually using, that’s not an issue. If you’re just using the svg for filters, the svg itself needs to be… Read More

My Favourite Text Gradients

Note: I am using -webkit prefixed styles for all three relevant rules to ensure that only browsers that implement all three will load the background gradient at all. I could use a proper polyfill and/or @supports, but honestly this creates more readable code. Non-webkit browsers have started using webkit prefixes too, so this code works… Read More

Changing the Colors of Input Elements

Ever been on a forum site with a really nice dark theme, but then you go to make a post, and are presented with a large blindingly white text area to type in? Maybe with tiny, hard to read font? Of course you have. But this is a 100% fixable problem.