フッターの各記事のタイトルの下に33％が割り当てられ、タイトルの長さが異なるという事実により、いくつかの不快な効果が現れます。
1）名前が短く、隣接する名前が長い場合は無効。
2）名前はブロックの上端に付いています。
3）ブロック全体ではなく、テキストのみをクリックする必要があります。
たとえば、ここの中央のリンクでは、すべて同様に、テキストを狙う必要があります。
少数がそれらを高貴なものにしたらどうでしょうか？
リンクの外観を改良しても、下線を削除してホバーの色を変更するだけで、高さの違いはあまり満足ではありません（ZenCommentユーザースタイルのバージョンは過去2か月間機能しました）。 また、台詞は歌姫であり、
テーブル-テーブル-行-テーブル-セルスタイルにも要素がないため、スクリプトなしで垂直に中央に配置することはできません。 しかし、テーブルに3ブロックを配置し、幅を気にしない場合はどうでしょうか？ 結果は優れています。テーブルの幅は100％で、セル自体の幅はコンテンツに応じて調整されます。
セルのフィールド全体でリンクをアクティブにするには、
{display：table-cell}プロパティをマップする必要があります。 場合によっては、テーブルがコンテンツを完全に整列できない場合（完全に通常のケース）でも、
{vertical-align：middle}セルプロパティは状況を修正します。
HTMLコード：
<div class="rotated_posts" style="display: table; width: 100%;"> <div class="rotTRow" style="display: table-row;"> <a class="grey" href="http://habrahabr.ru/post/147042/"> ( ) </a> <a class="grey" href="http://habrahabr.ru/post/149179/"> , email , </a> <a class="grey" href="http://habrahabr.ru/post/147828/"> . </a> </div> </div>
基本的なCSSスタイル：
.rotated_posts{ display: table; width: 100%; } .rotated_posts .rotTRow{ display: table-row; } .rotated_posts .rotTRow a.grey{ display: table-cell; padding:0 12px 4px; vertical-align: middle; }
（この方法はIE6-7では機能しません。明示的にテーブルを記述する必要がありますが、定義上IEがないユーザースクリプトに適しています。）セル間のギャップは24ピクセルで選択されるため、隣接する名前が互いにくっつくことはありません。
ここでは、マウスでウィンドウの端を徐々に移動し、小さくなり、ジャンプします。3つのリンクすべてが2行になり、テーブルが再構築されました。 スクリーンショットから、リンクが選択されるように、ブロック内の任意の場所をポイントするだけで十分であることがわかります。
HabrAjax
ユーザースクリプトと一緒にZenComment
ユーザースタイルで実際の動作を確認し、そのようなフッタースタイル（およびその他の50の改善点）を
使用できます 。 ここのスクリプトはHTMLを目的の構成に変換し、スタイルはすべてを整理するのに役立ちます。
HabrAjaxを個別に使用する場合でも、フッターも見栄えがよくなります。
