How should you code your CSS to make it easiest and fastest to locate elements?
Better CSS Part 6: Coding Standards
Reply
Category Archives: My PHP / MySQL Life
Better CSS Part 5: Layout Structure
Many people (me included) can get in the habit of placing things in a CSS file wherever you want. I want to put an end to that.
Better CSS Part 4: Naming Conventions
When you are giving names to your ids and classes use names that are appropriate and clear. If you had a class just called “wrapper” and someone else was looking at your CSS they would have no idea what it is used for or where it’s in use. Give it a more descriptive name like “wrapper_header” or “wrapper_image”. I also prefer to use an underscore to seperate words in my class and id names, but it’s also acceptable to use camel case like “wrapperHeader” or “wrapperImage”. In my opinion I feel that using an underscore is more readable at a glance, but using camel case does get rid of a character if you’re really worried about file sizes.
Continue reading
Better CSS Part 3: ids vs. classes
This is a touchy subject. Whether you should use the id attribute or the class attribute in your HTML to style things with CSS. One thing is certain, XHTML standards say that ids must be unique. If you have multiple ids that are the same, then you need to refer to them with classes instead. With that out of the way, it seems clear to me that the majority of your styling is going to be done using classes.
Continue reading
JQTouch – Tap Event Handling for Browsers and Mobile Devices
JQTouch is an awesome platform when it comes to making a mobile optimized website. One problem that I run into a lot is that I develop on my PC, and it’s extremely cumbersome to debug and test on my mobile device during the development process. Instead, I use my PC browser to do most of my debugging and testing, then I just test out major revisions on my cell phone.
JQTouch DynamicHeight Extension
This is an extension for JQTouch (a framework built on top of JQuery) that allows you to build mobile optimized websites. This extension arose out of the need to have a dynamic min-height setting rather than relying on the static min-height settings in the jqtouch.css file. This allows for greater cross-browser compatability when aligning items to the bottom of a page or on background elements.
Better CSS Part 2: The Role of CSS
Most of my styling practices center around the role of CSS. CSS was developed so that you could easily and quickly change how a website looks without needing to edit your HTML files. With that in mind, the first order of business is first code your HTML in a way that isn’t married to CSS.
Continue reading
Better CSS Part 1: Introduction
I’ve done a lot of development over the years and I’ve seen a lot of different approaches to how people style their CSS code. I am going to show you what works for me, and why it works for me.
Continue reading
JQTouch Advanced Ajax Links
As I’ve been working with the JQTouch links, I’ve noticed that they don’t do a very good job with ajax links. It appears that those links will only work if they are nested in a <li> element. I have a button that sits at the bottom of my home screen that I want to have it load a dynamic page each time it’s clicked via ajax. I was able to do it with a relatively simple bit of code that I will credit Gonzalo Floria with at Google Code for JQTouch.
Continue reading