Problem is I could only fake it but not get the real one like below image.

Then I had a look at http://www.stunningcss3.com/ and found that the heading is having very nice Letter press effect and guess what it’s purely in CSS3.

When I inspected the style I found this

text-shadow: rgba(255, 255, 255, 0.699219) 0 1px 0, rgba(0, 0, 0, 0.496094) 0 -1px 0;

So the trick is putting two text-shadow which is cool (and am not aware of that )

I created a little demo in labs … have a look

View App in Quesb Labs

NB: you have download the attached file, unzip it and open the file cards.html. Check in Firefox 3.6 or Chrome or Safari for CSS things.In IE there is actually nothing exciting.

Thank’s to my colleague Eirik Mikkelsen for updating the code for Opera.

Suman

Of course table based layout is:

1. Easier to code
2. Easier to understand
3. User don’t really care it’s table or DIV… browsers anyway renders it
4. What the big deal in accessibility thing … data grids will be table, how about that??? Why UI team don’t object that !!!
5. UI team talks about grid … table is better grid option than DIV. Isn’t it logically ???

Ok the above quotation are not made up by me … I just overheard, heard, listened from the team.

I will try to explain our or the professional UI developers argument for using HTML+CSS than using table for lay-outing.

Not all are my words, I have picked quotes from different places around the web as well.

Argument 1:

Let’s look at the below code …

class car {
int wheels = 4;
string engine;
}

car mybike = new car();
mybike.wheels = 2;
mybike.engine = null;

I picked this example from an forum thread …

Is the code wrong ? Of course not … at least technically. But will you prefer this code … no because it is not meaningful.

It is not semantic.

HTML is all about semantics. Different HTML tags are there to define what kind of content it contains not how it should look.

e.g.:

• <P> for paragraph of text
• <table> should have meaningful data-grid type of content.
• <DIV> semantically acts as a container for different thing.

There is a long list but you get the point right!!!

Argument 2:

It is not very easy to linearize layout table.

Probably this w3c article will provide proper explanation to the curious.

Argument 3:

Table layout is more readable and easier to understand by most of the people – standard argument for table.
“Most people” don’t matter. Professionals matter. For professionals, table layouts create many more problems than HTML + CSS. This is like saying I shouldn’t use GVim or Emacs or Visual Studio because Notepad is simpler for most people. Or that I shouldn’t use LaTeX because MS Word is simpler for most people.

again I picked this answer from a forum thread and added my bit …

Argument 4:

Table rendering in browser is slow

This problem increase exponentially in case of nested table. Not because of more HTML tags but because:

1. Table is rendered only when the full table is downloaded
2. Rendering algorithm for table is much complex than DIV which increase the rendering time further.

Argument 5:

Separating content from layout and presentation.

Simply speaking when a developer develops page using table she must understand the layout of the whole page to make it render effectively.

Whereas when frontend engineer develops HTML page the focus is to put only the content in the HTML page and put all the layout and design login in CSS.

Result ….much cleaner HTML and lesser burden on developers to understand the structure.

I introduced a new section i my website … quesb labs

I will be putting all my experiments in this section. Currently I have not dedicated any page for it … just the directory listing.

The first experiment is a digital clock. I tried to experiment with :nth-child pseudo class of CSS3.

Digital Clock

I will write back after I come back on 12th December , 2009

Till then amen…

Looks like folks at Google had setup a big plan long back.

Although the official release of Google Chrome OS is still an year to go, Google has released few very nice videos describing their approach towards operating system. It’s also interesting to note that Google is planning a custom made hardware to give a whole new experience to it’s user such as lightning fast boot experience.The approach Google has taken has a big assumption at it’s root. users most used application is internet. Which is kind of true anyway.

It will interesting to note how Google will handle other stuffs that users would like to do in their computer let’s say gaming.

But let’s leave that to the creative folks at Google to decide. For now enjoy few interesting and innovative videos by Google describing Google Chrome and it’s feature.

Cheers

Here are the list of few very well know company design guides , which provides very rich information on how to write a successful guideline and very of course some very good resources about design best practices at different platform. It also acts as inspiration as well for creating  a world class design.

SAP Design Guide

Apple Human Interface Guideline

Windows Vista UX Guideline

Paypal X Interface Guideline

header('Content-type: text/css');
 
ob_start("compress");
 
function compress($buffer) {
    /* remove comments */
    $buffer = preg_replace('!/\*[^*]*\*+([^/][^*]*\*+)*/!', '', $buffer);
    /* remove tabs, spaces, newlines, etc. */
    $buffer = str_replace(array("\r\n", "\r", "\n", "\t", '  ', '    ', '    '), '', $buffer);
    return $buffer;
}
 
/* your css files */
include('screen.css');
include('typography.css');
include('grid.css');
include('print.css');
include('handheld.css');
 
ob_end_flush();