WWW posts page 26

Duplicate selectors: Increase specificity without being more specific

in

CSS has a concept of specificity wherein more “specific” selectors take precedence over less specific. Sometimes specificity rules cause a set of property values to be applied while another is desired. This can result in the developer increasing specificity on the desired set to outweigh the other set. When I’ve needed extra specificity, I’ve often use an ‘html’ class on the <html> element or a ‘body’ class on the <body> element. The downsides of are it:

  • is more specific, as in precise, meaning the selector won’t match in a document without those helper classes.
  • has a performance penalty for needing to check a(nother) parent element of the target element.
  • only allows one more unit of specificity at the class level for each parent used.

Today (yesterday), I found a better way that can add any amount of class level specificity (weight) without being more specific (precise), thanks to CSS Wizardry. I’ve been doing this CSS thing for a while, but I hadn’t realized .foo.foo would match <div class="foo">. In essence, you can duplicate a selector and chain it onto itself to create an equivalent selector, but with double the specificity. You can duplicate it as many times as needed to get the desired specificity, e.g. .foo.foo.foo.foo to override .foo.foo.foo, without requiring any parent selectors. Besides the benefits already mentioned, it could be seen as more explicit in its purpose than using parent elements, because there is no other reason to do it. I will have to start using this.

WordPress.com redirects don’t support HTTPS

in

Gah. Apparently wordpress.com is discouraging ‘https’ for self-hosted blogs: Their redirection service does not allow any protocol but ‘http’. I could swear it did when I first set it up, as I remember typing in my URL with ‘https’ and I thought I tested it with curl -I to make sure it works, but the docs have an explicit note saying:

Note: Site redirects will only point to a non-ssl ( http:// ) url.

I don’t remember seeing it before, but the wayback machine suggests it was there since 2013, well before I switched to self-hosted.

Continue reading post "WordPress.com redirects don’t support HTTPS"

Sending email attachments with PHP `mail`

in

I recently had to set up a PHP script to send an email with an attachment. With the current version of our CMS, we have swiftmailer available, which would make this easy, but for this site, I didn’t have it easily available. I considered bringing it in, but since this was just a simple script, I decided to give a go at doing it directly with PHP’s built in mail() function. I found an answer on StackOverflow to guide me. Many respondents to that question recommended just using a library, but the answers that didn’t seemed reasonable.

It took me a number of failed attempts to get the headers and line-breaks just right so that both the email message and attachment sent properly, but I got it working. The code of my solution was fairly specific to the application, so I’ve modified it to make it more generically applicable for this post. The (untested but generic) variant of the solution looks like:

Continue reading post "Sending email attachments with PHP `mail`"

SCSS rgba color fallback mixin

in

Browser support for rgba colors is very wide, basically working in everything but IE8- and really old browsers. In the name of progressive enhancement, it’s still good to give those browsers a fallback, the simplest being the solid version of the same color. This can be done by putting the property twice, once with a solid value and once with an rgba value. The non-supporting browsers will take the solid color and ignore the rgba, while the supporting browsers will take both, with the rgba overriding. As an example: color: #fff; color: rgba(1, 1, 1, 0.6);.

To that end, I created a mixin to do this automatically, similar to my remFallback mixin:

Continue reading post "SCSS rgba color fallback mixin"

in

There must’ve been a flexbox bug in Firefox 45. Today, it was brought to my attention that nav was getting cut off on a site. I added a flex-shrink: 0 to ensure the logo shrank to accommodate, fixing the problem in Safari, but not Firefox. Thinking it odd that Firefox was behaving so differently from other browsers, I decided to check for an update, and 46 happened to be available. After updating, the problem disappeared. I’ve ran into browser bugs with flexbox before.

Globbing files including dot-files

in

Normally globbing for the wildcard * will find all files in a directory except for ones beginning with a .. Sometimes I need to get all files including the dot-files. The pattern .* will find these hidden files, but will also include . and .., referring to the directory and its parent. As I’ve learned in the past, this can be dangerous with commands like rm, (i.e. you running rm -rf .* to remove dot-files will remove more than expected). Today, needing to get all files in a particular path in PHP, I sought a solution. A post on a Perl forum gave me a solution using curly braces: {.??*,.[!.],*}. Braces basically allow multiple comma-separated patterns to be evaluated. The three patterns are:

  1. .??* matches a dot followed by two characters followed by any number of characters.
  2. .[!.] matches a dot followed by a single character that isn’t a dot. This is needed since the previous pattern doesn’t match this case.
  3. * is the normal wildcard glob, matching all non-dot-files.

In PHP, the glob() function requires the GLOB_BRACE flag to use braces. An example might look like: $files = glob($path . '/{.??*,.[!.],*}', GLOB_BRACE);. This did exactly what I wanted.

WordPress plugin: changing rel-canonical

in

I serve my site over both HTTP and HTTPS to support older browser that can’t support modern or any HTTPS protocols. I prefer HTTPS for search engines and general use though, as it is more secure, increases user privacy, and is factored into SEO rankings. Due to an issue with my sitemap, Google ended up indexing all of my blog pages as HTTP. The first thing I’m going to try to get Google to show my blog pages as HTTPS is to set the rel-canonical link to the HTTPS version regardless of which protocol the visitor uses. WordPress doesn’t have a built in way to change the canonical URL, and I didn’t want to install a heavy SEO plugin just for this, so I wrote my own.

This simple plugin removes WordPress’s rel_canonical action, then replaces it with its own. I basically re-implemented WordPress’s own functionality, replacing the http with https before outputting the link. It looks like:

Continue reading post "WordPress plugin: changing rel-canonical"

Tax worries again

in

This past night I worked on my taxes, a stressful endeavor. I am an independent contractor, which has made things way more complicated than they used to be. I’ve been using the Free File program to use online applications for filling out taxes for years now, usually using TurboTax or H & R Block. They abstract from the forms and walk me through everything, and often provide help when I’m confused, but they can sometimes be worded confusingly. I just do the best I can. The biggest problem with the abstraction is that everything is trapped in this interface, so it’s hard to review it yourself and make sure everything is right.

Every year I worry that I’ve done something wrong, and this year is no exception. Since becoming an independent contractor, having to pay estimated taxes, I don’t really get a “return”, either applying my over-payments to next year or often having to pay additional. This year, though, I have a rather large over-payment, more than enough to pay my first quarterly estimates for 2016. That worries me. I’ve made a fair amount less than last year, so it may be right, but I’m still unsure. I’m going to sit on it and come back to it another night, see what I can do to review it.

Another thing I do every year is say that next year I’m going to work with an accountant. Every next year I wait until it’s too near tax time to comfortably figure out how to do that. I don’t really know how that works or what it would cost. It’s more of a consultation and review of how I’m doing the taxes myself that I need. Maybe next year. We’ll see.

in

Got moved to a new server in a new datacenter by Dreamhost this weekend. Seems to be significantly faster than the old one for first page load, like an order of magnitude. It’s more in line with what I get when testing locally. I assume the server I was on was just overloaded. It had often had a load average in the 6’s or 7’s. I had been wondering what was wrong and if I should swtich to VPS. This one’s been at less than one. Hopefully it stays snappy and doesn’t get too loaded up over time.