現在下記サイト
http://dca-labo.info/demo8
のヘッダーの左上に「サイトマップ」「お問い合わせ」のリンクを貼りたいと思っています。
その際のCSSの記述はいくつかあると思うのですが(といっても思い浮かぶのはpositionくらいしか
ないのですが・・)今回の場合どのような記述方法がベストでしょうか?
header の左上というと、グレーになっている部分をイメージしているんでしょうか?
質問で提示されたサイトでは、この部分は、header タグではなく、それを囲んでいる DIV#page の margin と、BODY の padding で作られています。
その位置にリンクの要素を配置するとしたら、サイトマップやお問い合わせのリンクの要素を囲む DIV などを作って、
のどちらかになるのかなあ、と思います。
# こんなので、回答になってますか?
「サイトマップ」「お問い合わせ」を入れたいポイントは下記をみて頂ければと思います。
まず、header タグ近辺の文書の構造がこんな感じです。
header の範囲が、
hgroup の範囲が、
h1 の範囲が、
h2 の範囲が、
となってます。
# Firefox の「要素の調査」を使ってます。
んで、文書の構造を大切にするなら、リンクを囲む要素は hgroup の中で、h2 の後かな、と思います。
その位置に挿入して、h2 よりも上で、h2 の終了位置よりも、開始位置を左にするなら、
のどちらかだと思います。
文書の構造なんか知ったこっちゃない、ということであれば、h1 の前に挿入して、
という感じで、位置を調整。
文字のサイズやフォントなどの修飾はお好みで、という感じでしょうか。
まだ、ぼくのエスパーレベルは未熟なようです。
2013/03/14 22:49:56というわけで、回答に追記しました。
ありがとうございます。確認してみます。
2013/03/14 23:14:06