Web Artisan Blog - ウェブ アルチザン ブログ

CSSで、
アンカータグを横並びにするか縦並びするか（改行するかしないか）の調整を行うには、
「display」の”block”か”inline”で調整する。

block（ブロック要素）とinline（インライン要素）の意味は、
HTML文書の基本となるところなので、下記リンクで理解しておく。
「ブロックレベル要素とインライン要素」

つまり、CSSによるアンカータグの横並び縦並びでは、
block＝改行あり
inline＝改行なし
という事で、CSSに定義する。

（例）
当サイトの「Category」部分はアンカータグ縦並び、
カレンダー部は、アンカータグ横並びとなっている。
下記は当サイトのCSS定義。

★Category部

#sidebar-a a {
 font-weight : normal;
 font-size : 90%;
 display : block;
 color : #ffffff;
 text-decoration : none;
 padding : 4px 3px;
 margin : 0 0 2px;
 border : 1px solid #8b0000;
 background-color : #b22222;
}

★カレンダー部

#calendar-side a {
 font-size : 90%;
 display : inline;
 color : #336699;
 padding : 2px;
 text-decoration : none;
 margin : 0 0 25px;
 background-color : #f5f5f5;
 border : 0 solid #808080;
 font-weight : bold;
}