CSS Articles
-
another great CSS media query demo
This demo is from Daniel Glazman who works actively on web standards and is a long-time mozilla contributor. CSS Media Queries were originally a proposal submitted to the CSS Working Group by Opera Software and are now implemented in Firefox 3.5. In short, Media Queries extend the media declaration attached to a stylesheet to allow […]
-
the text-shadow spotlight
Zachary Johnson has put together another fun demo. He’s using some JavaScript and the new <a href="http://hacks.mozilla.org/2009/06/text-shadow/">text-shadow</a> property to build a spotlight effect. It’s embedded below. If you can’t view it, click through to his post. View the Demo in Firefox 3.5
-
shadow boxing with -moz-box-shadow
Another fun CSS3 feature that’s been implemented in Firefox 3.5 is box shadows. This feature allows the casting of a drop “shadow” from the frame of almost any arbitrary element. As the CSS3 box shadow property is still a work in progress, however, it’s been implemented as -moz-box-shadow in Firefox. This is how Mozilla tests […]
-
Firefox 72 — our first song of 2020
Though we are moving to a more frequent four-week browser release cycle, the Firefox 72 release is feature-rich and full of goodies. It includes many requested DevTools' updates and improvements. We also introduce Shadow Parts and the CSS Motion Path, and useful new JavaScript features. Plus, Picture-in-picture for video is now enabled for Mac and Linux users too!
-
opacity in Firefox 3.5
This is a very short post, but it’s worth putting up because it shows how browser features go from a vendor-specific implementation to a fully supported standard. In Firefox 3.5 we no longer support the Mozilla-specific CSS property -moz-opacity. Developers wanting to set the opacity of an element should use the standard <a href="https://developer.mozilla.org/en/CSS/opacity">opacity</a> property […]
-
a short introduction to media queries in Firefox 3.5
This post is by Eric Shepherd, who leads Mozilla’s documentation project at the Mozilla Developer Center. In this day and age, it’s important for web content to support rendering on an increasingly wide variety of devices. Not only do users expect to use your content on their home computer, or read it printed on paper, […]
-
And now for … Firefox 84
As December ushers in the final curtain for this rather eventful year, there is time left for one more Firefox version to be given its wings. Firefox 84 includes some interesting new features including tab order inspection, complex selector support in :not(), the PerformancePaintTiming API, and more!
-
A new CSS Grid demo on mozilla.org
With CSS Grid shipping across browsers this spring (already in Firefox 52 and Chrome 57; Safari, and hopefully Edge, soon to follow) some of Mozilla's in-house designers and developers decided to experiment with the technology on mozilla.org. The result is a live demo site that shows CSS Grid features and provides links to our favorite resources.
-
Taking About:Home Snippets to the Next Level.
If you are a Firefox user and you start the browser this morning or you type “about:home” in the URL bar we have a surprise for you. Instead of the Firefox logo you’ll see an animation celebrating the global spirit of community. This is just one of many planned enhancements to mozilla.org pages and mozilla […]
-
HTML5, CSS3, and the Bookmarklet that Shook the Web
On Valentine’s Day last year we released a bookmarklet that went viral riding the popularity of the Harlem Shake meme. On the anniversary of its release we’d like to take a moment look back at the technical nuts and bolts of the bookmarklet as a case study in applying HTML5. In fact, the HTML, JavaScript, […]