CSS-Tricks
Tips, Tricks, and Techniques on using Cascading Style Sheets.
-
Typographic Grid
View Demo Download Files This is not a framework or anything, I was just screwing around with typography and getting things to line up according to a strict horizontal and vertical grid. It is inspired by the Compose to a Vertical Rhythm article by Richard Rutter a few years a …
-
The Last Links of Interest - Other Great Places for Links
Ive done 62 Tuesday Links of Interest posts over the past 18 months or so. its been fun and a good way to share links, but Im letting you know this will be the last one. Its not because I dont like sharing links, its because me doing it here is just a little redundant to link sharing I do elsewhere …
-
PHP for Beginners: Building Your First Simple CMS
The Magic of PHP + MySQL Its safe to say that nearly every website thats up-to-date these days is using some form of content management system (CMS). While there are a ton of great free options that provide us with a CMS to power a website (Wordpress, Drupal, etc.), it doesnt hurt to peek under the …
-
Launch: Are My Sites Up?
Hey folks! Me and Richard have just launched a new site I think many of you will find useful. Its called Are My Sites Up? - I bet you can guess what it does =) Monitor ALL your sites The idea is that many of us are responsible for maintaining a number of websites. Business, personal, or otherwise. W …
-
New Screencast: Skinning phpBB
Creating a completely custom theme for the popular forums software phpBB would be a monster job. Fortunately, to get up and running quickly, we can simply wrap a default installation of phpBB into the skin of an existing site pretty easily. We do just that in this screencast, and work out the kinks …
-
Thank You (2008 Edition)
Happy New Years Eve everyone! Just taking the opportunity to say thanks to everyone (again) for visiting and being a part of CSS-Tricks. This site has came a long way in one short year, and now is a great time to reflect. Milestones Screencast Launched I moved to Portland, OR at basically the very f …
-
Dynamic FAQ Page - A Lesson in Accessibility and Progressive Enhancement
View Demo Download Files The Idea To make a Question Answer style page which is embellished in functionality by JavaScript and the jQuery library. Each question will be shown in a box with a tag hanging from the bottom of the box. When clicked, the tag will slide out and reveal anoth …
-
New Poll: What is your CSS framework of choice?
Just tossed a new poll up. This time covering CSS frameworks, which we have never polled before. Kind of curious to see which of them is the most popular, among the people that actually use them. Ive only included six of the ones that seem to me like the most popular, but if I have missed a really b …
-
Ho Ho Ho!
.wishing { you: happy-holidays !important; } Have a lovely day everyone! Its definitely a white Christmas here in Portland. I plan to do a recap of the year next week and tell everyone just how thankful I am for this site and the community we have. Sorry for no screencast today, I meant to get t …
-
Poll Results: How do you keep track of design inspiration?
As always, fascinating results. I am part of the very smallest segment, in that I use an image-based social bookmarking service, ScrnShots, to keep track of a lot of my design inspiration. Im not a nut about it though, and I definitely cruise the galleries as well. I was surprised to see Local Bookm …
-
Blurry Background Effect
When setting a background image on a page element with CSS, you can control its position with background-position, but an often-forgotten trick is that you can control its position behavior with background-attachment. Utilizing two images, we can pull off a pretty simple and fun CSS trick Im callin …
-
Site News: iPhone/iPod Stuff
Few quick announcements! iPhone/iPod Version of Screencast Many, many people asked for this. I resisted a long time mostly since I thought seeing them on such a small screen would be useless. But I concede that listening and sort-of seeing might be good enough, and you can always get the bigger vers …
-
PHP Include from Root
When I reference images, I almost always do something like this: <img src="/images/logo.png" alt="logo" /> That is a relative file path, but it begins at the root public directory of the site. That way it always references the same location, no matter what directory that code snippet ends up i …
-
New Screencast: CSS Shorthand
There are a handful of CSS attributes that can be combined into a single attribute for coding brevity. I endorse the use of CSS shorthand whenever possible. It saves space and makes code more readable. In this screencast I introduce all of the common ones and go over a few gotchas that can happen wh …
-
New Site: Quotes on Design
Heres another new site from me. I love reading books about design, so Ive made a little site to help immortalize the great little quotes I come across. There arent a ton of them up there yet, but I plan to add to it whenever I come across anything good in a book, blog, or anywhere else I see a good …
-
Force Secure Form Submission
I was working with a client eCommerce site the other day, and a really concerning problem popped up. On the very last step of checkout, when you press the very final button to submit the order, the browser would pop up a security warning telling the user that the page was secure, but the data being …
-
New Site: HTML Ipsum
There are a number of Lorem Ipsum sites that I like. I even have a dashboard widget for generating it. But none of them does what I REALLY want, which is to give me the Latin text already in HTML tags. So, I built one. Visit Site Clicking on any of the blocks automatically copies the t …
-
New Screencast: Domains, DNS, Hosting and Google Apps
Dealing with domains and hosting and all the server setup stuff isnt usually the most comfortable stuff for web designers. In this screencast I walk though my regular process and share many little tips of how I like to handle it. I use a real live domain name that I recently purchased on Go Daddy, …
-
Cub Scouts WordPress Theme
On the number of past screencasts on WordPress, Ive showed off a few techniques using a site we did at work for my boss sons Cub Scout Pack. We got a few people interested in the theme, so we thought wed clean it up and make it available for purchase. It is now on ThemeForest. Purchase Theme …
-
Track Outgoing Clicks in Google Analytics with jQuery
Ian Pitts sent me this trick a while back and Im just getting around to publishing it. Thank Ian! Google Analytics (intro video here) is powerful stuff, but one notable lacking feature is data on outgoing clicks. If you are using jQuery, plop this code on your page and youll be tracking outgoing cli …
CSS-Tricks
