Skip to main content

CSS

warning: Creating default object from empty value in /var/www/venutip.com/public_html/modules/taxonomy/taxonomy.pages.inc on line 33.

Targeting Firefox while using LESS.css

File under

The most common CSS hack to target Firefox is to put something like this in your stylesheet:

@-moz-document url-prefix() { h1 { color: red; } }

But if you’re using LESS.css, this is a problem, because LESS uses the ‘at’ symbol (@) for variables. When LESS parses the above declaration, since @-moz-document isn’t a variable, you get an error.

Thankfully there are other easy ways to target Firefox in CSS that allow us to continue using LESS. For instance:

body:not(:-moz-handler-blocked) #your-target-element { 
  color: red;
}

Loops : recursion :: tables : CSS

The latter may seem harder to understand at first, but in certain situations, the former is a nightmare, whereas the latter is a pleasant dream.

Disappearing bullets in IE

Last week, I had a frustrating experience trying to restyle a simple nav bar. The problem was cross-browser: everything looked great in Firefox, but I was getting drastically different results in IE. The issue at hand? Disappearing bullets.

Syndicate content