Style Grind » Tutorial

100 Essential Resources for Web Developers

Peter — Mon, 13 Aug 2007 16:52:07 +0000

A Web developer’s life is hard enough without having to go on the hunt for good developing resources. To help you take a load off, we’ve compiled a list of some of the best tools available. After using these resources, you may still have 99 problems, but we guarantee that developing ain’t gonna be one of them.

Removing Dotted Links

Peter — Sat, 08 Apr 2006 19:05:59 +0000

If you dislike this quirk as much as I do, you’re in luck. Tech Manifesto will provide a few methods for squashing this bug and another tweak which will completely remove it from your browser’s default behavior by editing the CSS that controls the user interface.

Learn CSS Positioning in Ten Steps

Peter — Thu, 30 Mar 2006 22:49:13 +0000

This tutorial examines the different layout properties available in CSS: position:static, position:relative, position:absolute, and float.

AJAX Login System using XMLHttpRequest

Peter — Thu, 16 Mar 2006 03:45:53 +0000

Creating a fully secure “ajax”-powered login system, ideal for blogs, forums, and other similar sites. I had a barebones secure case working within a few hours, and a few more hours gave the final result that I will share today.

Vertical Centering

Peter — Wed, 15 Mar 2006 20:27:19 +0000

By proper vertical centering we mean an element sitting in a container that is dynamically positioned so that its horizontal centre line coincides with horizontal centre line of its container, unless it is taller than its container, in which case its top coincides with the top of its container.

The technique at: Waxpad

How to Make Firefox Forms Suck Less

Peter — Tue, 14 Mar 2006 13:19:28 +0000

Kevin Hale gives some quick tips on how to make your forms look more stylish in FireFox. This is the same technique being used on WuFoo.com.

Ajax Progress Bar

Peter — Fri, 10 Mar 2006 14:47:42 +0000

This Italian site gives some examples on how to get an AJAX status bar up and running on your site. The tutorial is not in english, so you will have to run it through a translator first.

Getting Started with Ajax

Peter — Wed, 08 Mar 2006 21:12:21 +0000

A List Apart is pleased to present the following excerpt from Chapter 27 of Web Design in a Nutshell, 3rd Edition by Aaron Gustafson.

“In a nutshell, it is the use of the nonstandard XMLHttpRequest() object to communicate with server-side scripts. It can send as well as receive information in a variety of formats, including XML, HTML, and even text files. Ajax’s most appealing characteristic, however, is its ‘asynchronous’ nature, which means it can do all of this without having to refresh the page.”

Clearing floated images in body text

Peter — Wed, 08 Mar 2006 14:26:33 +0000

A problem that I’ve been running into more often in these days of CSS based layouts than I did back in the old table days is the “image sticking out of the bottom of the content area” problem that often occurs when an image is floated left or right, and there isn’t enough text to exceed the height of the image. A problem that sometimes had no easy fix. After doing some thinking and experimenting I came up with a method that works well as far as I can tell. Not having seen it described anywhere else before, I thought I’d share.

Create a To Do List with Ruby on Rails

Peter — Fri, 03 Mar 2006 19:02:28 +0000

Thehua has a great beginners tutorial for creating a easy and simple to-do list using Ruby on Rails. The tutorial is presented in flash, however there is a PDF download for easy offline reading.

AJAX and PHP to deliver content

Peter — Fri, 03 Mar 2006 13:33:28 +0000

This tutorial will teach you how to take your sql database of tutorials or anything else, and be able to use ajax to show each category just by clicking on a word without having to refresh pages. What allows us to do this is ajax and javascript.

CSS Pop Up Menu

Peter — Thu, 02 Mar 2006 21:08:56 +0000

The following tutorial features a pop up menu written purely in CSS, similar to the one on the BrokenBlade website. The code uses XHTML lists which are then styled to produce the hover effects. No Javascript is used apart from IE browsers as they will not display the hover effect without it. More on that later though, first off we’ll begin by creating our menu in XHTML.