CSSでブロックレベル要素とインラインレベル要素の変更

こんなCSSを書くと、

a { display : block ; }

大抵のブラウザでは、a要素のcontentの上にマウスカーソルを当てると、マウスポインタや文字の色を変えたりして、リンクであることを知らせるが、それが水平方向にどこまでも伸びてしまう。

そのほかにも、p要素をインラインレベル要素にしたりできる。このインラインレベル要素かブロックレベル要素かを、変更できる機能を使えば、非常に面白いことができる。
たとえば、code要素は、コードを記述するためにある、意味的な要素だ。そこで、このブログでソースコードを記述する際には、この要素を使いたい。また、コードは普通、いくつもの改行がある。そこで、CSS2.1を使い、white-spaceプロパティに、pre-wrapを指定したい。ところがこれが、問題だ。code要素は、インラインレベル要素なので、そのまま指定したのでは、問題がある。そこで、code要素をブロックレベル要素に変えてやればよい。しかし、なぜこんなことをしなければならないのだろう。