You are here

css

CSS Sprite Tool on the web: SpriteHero

I just finished the first release of a new web app: SpriteHero. A CSS Sprite making tool built entirely in JavaScript and HTML.

CapitalCamp Session, July 22nd

Here's a link to my presentation, http://goo.gl/WTlj9. Source code will be posted here shortly. Or you can search to see some outdated code from DrupalCon SF and DesignCamp Boston.

DrupalCon Topics!

Two of my topics were chosen for DrupalCon 2010 in San Francisco!


DrupalCon 2010, San Francisco

More details soon.

Theme Ubercart presenation today at DrupalCon

Here is the slides to follow along with today's presentation, Theme Ubercart: Make your store shine.

Here is the CSS snippet for CSS buttons.

.node-add-to-cart{
   display: block;
   cursor: pointer;
   cursor: hand;
   width: 150px;
   height: 50px;
   border: 0;
   color: transparent;
   text-indent: -9000em;
   overflow: hidden;
   background: url('../images/add_to_cart.png');
}

The customcart module is attached below.

Sprite Hero, yet another CSS Sprite Generator

I wrote this Adobe Air app to generate CSS sprites for myself. It's pretty simple to run, but keep in mind that it's the first build and probably NOT STABLE yet.

Here's a screencast with a quick demo: http://www.screencast.com/users/jrowny/folders/Jing/media/b7c04c80-8cd2-...

Sorry for the crazy resolution, I'll make a better video later.

Cross browser CSS, margins, and padding

One problem I've always had is developing websites that look exactly the same in all browsers. I'm usually able to get Safari & Firefox perfect and nearly so with IE7+. I've learned a number of things over the years and I'm going to put them in this post. I'll probably update it a few times as things evolve and we move towards CSS3.

CSS Consistency

Start your CSS by setting all your padding and margins to 0!

html,body,h1,h2,h3,h4,h5,h6,p,ul,li,ol {margin:0;padding:0;}

or

*{margin:0;padding:0;}
category: 
Subscribe to RSS - css