個人的にはとても好きなTwenty Eleven。しかし嫌いな箇所が数箇所あります。今回は特にいやなTwenty Eleven最上部の隙間とヘッダーの縦幅を狭くしてみます。カスタマイズ前は下記のようになっています。

まず最上部の隙間をなくして濃いグレーの線を消します。下記のコードをCSSの最下部に追加してください。

#page.hfeed { margin-top: 0px; }

CSS内のborder-top: 2px solid #bbb;を削除します。

この2つの作業を行うだけで下記のように最上部の隙間がなくなります。

この隙間がなくなると次はヘッダーの縦幅が気になりますので縦幅を狭くしてみます。下記のコードをCSSの最下部に追加してください。

#site-title {
	font-size: 32px;
	text-shadow: 0px 1px 1px #ccc;
	margin: 0px;
	padding: 14px 0px 0px 15px;
}

#site-description {
	font-style: normal;
	color: #999;
	line-height: 1;
    margin: 0 0 14px 0;
	padding-left: 20px;
}

#site-title a {
	color: #333;
	letter-spacing: -0.05em;
}

#branding .only-search #s, #branding .only-search #s:focus {
    width: 100px;
}

#branding { border: none; }
#branding img { border-top: 1px solid #aaaaaa; }
#branding hgroup {
	margin: 0 0 0 10px;
	overflow: hidden;
	zoom: 1;
}

#branding #searchform {
	right: 2.5%;
	top: 1.5em;
}
#branding #s {
	font-size: 12px;
	height: 22px;
	padding: 4px 10px 4px 38px;
	width: 110px;
}

#branding #s:focus {
    width: 100%;
}

コードを追加してファイルを更新すると下記のようなヘッダーになります。