Archive for the ‘CSS’ Category

Autoscroll Override

March 8, 2006

Have you ever noticed the little image that’s overlayed on your screen when you middle-button click to scroll a page? When looking over SitePoint the other day, I noticed something odd, that little image was different.

With a little bit of CSS, it’s possible to change that little overlay graphic to something more customized. As far as I know, it’s only supported in Firefox, but I haven’t done much testing, just enough to know IE doesn’t support it (what’s new?).

html>img {
    width: 0 !important;
    height: 28px !important;
    padding-left: 28px !important;
    background: url(autoscroll.png);
}

I don’t suggest actually changing it unless you feel it really adds some ascetic appeal to your website, as the generic browser-provided overlay is more than sufficient for most purposes.

Advertisements

Selection Styles

March 8, 2006

With the creation of CSS3 it’s now possible to define the color and background of selected text. It first caught my attention when browsing moo.fx’s website. QuirksMode had a short article on it as well.

While it has no real practical use, it can certainly add to the ascetic appeal of a website when properly utilized. Simply add the “::[-moz-]selection” Psuedo Element to your stylesheet and define the color and background values to whatever you like.

::selection {
    color: #666666;
    background: #CCCCCC;
}

::-moz-selection {
    color: #666666;
    background: #CCCCCC;
}

You can check out the W3 Specifications for more information on this interesting new addition to CSS.