Question

Here is the CSS:

header {
  width: 400px;
  margin: 0 auto;
}
section {
  width: 400px;
  margin: 0 auto;
}
footer {
  width: 400px;
  margin: 0 auto;
}

Here is the query on index.html that I have:

<link rel="stylesheet" href="mobile.css" type="text/css" media="handheld" />

It looks correct, but I could be wrong.

Answer 1

Most smartphones can be targeted by using css media queries. And as an advantage you can also target small browser windows.
Have look at http://www.lessframework.com there is explained what these queries do, and how you can adopt is.