The CSS Archive

HOWTO: build a Technorati top tags ticker with PHP, jQuery, JavaScript and AJAX - day 3 of 3

The third and final installment of this three day tutorial has arrived, and the completed ticker is finally unveiled. On day one I reviewed the Technorati API and the PHP, and on day two I walked through the XHTML and CSS. Today, I will break down the jQuery, JavaScript and AJAX components of the ticker. For those of you unwilling to wait for the reveal, click here for a demo. Continue reading.

HOWTO: build a Technorati top tags ticker with PHP, jQuery, JavaScript and AJAX - day 2 of 3

In day one of this three day tutorial I gave an overview of the Technorati API, as well as the PHP, and ended with a screenshot of the ticker. Today, I will focus on the XHTML and CSS required to complete the visual look of the ticker. Tomorrow, I will finish up by walking through the jQuery, JavaScript and AJAX functionality, and I will unveil the completed top tags ticker. Continue reading.

HOWTO: build a Technorati top tags ticker with PHP, jQuery, JavaScript and AJAX - day 1 of 3

The “how to” I posted on sprucing up your search box with CSS and a background image received some great feedback. I have decided to follow up with a more in depth tutorial that takes advantage of the Technorati developer’s API, specifically, the ability to retrieve the current top tags. Over the next three days I will teach you how to build an imitation of the tags ticker running at the top of the Technorati home page, using PHP, jQuery, JavaScript and AJAX. Continue reading.

HOWTO: spruce up your search box with CSS and a background image

Very few designers appreciate the aesthetic of a text input field, and styling form fields cross-browser on any Web site can be a tedious and frustrating experience. The compromise typically involves applying a simple colored border and background to the fields. I think this is the right approach for Web sites and applications that are form field intensive, but the search box plays a special role in the design, and it deserves a little more attention. Continue reading.

Pure CSS menus are the elephant in the room

An elephant stepped into our midst on the day Eric Meyer brought us the first pure CSS menus prototype, and a steaming pile of manure was deposited with no Carny in site to shovel up the stinking heap left behind. Continue reading.

The five things every CSS beginner must know

Being a CSS beginner is difficult because you never know where to start the learning process. If you pose the question to any forum, you will get a myriad of answers, some good, but mostly, not so good. The worst is when you’re instructed to read the W3C documentation. That’s like asking a pilot in training to read the mechanic’s manual for the propeller. Only refer to the W3C when you’re looking for the technical recommendation. Eventually, when you have something specific you want to accomplish with CSS, and are unsure how, use Google to find the answer. Continue reading.

What they didn’t tell you about CSS

The frustrating thing about learning new Web technologies is the lack of “why didn’t someone tell me this before I began” need-to-know information. Especially with CSS, you’ll get tiny tips, tricks, hacks and everything in between, but for fear of lynching in the Web community, the last thing you’ll get is the bad with the good. I’ve been using CSS professionally now for a few years, and although I enjoy using it, there are definitely some points of contention worth noting. If you’re new to CSS, read through the list carefully, and remember to do your homework. (FYI - any statement of “this can’t be done” is a reference to purity - i.e. - it can’t be done without a hack.) Continue reading.