preへのスタイル指定

スタイル指定

pre.example {
  padding: 1em;
  border: 1px solid #000;
  width: auto;
  _width: 90%;
  overflow-x: auto;
  color: inherit;
  background-color: #f6f6f6;
  font-family: 'MS Gothic', monospace;
}

横にあふれるサンプル

<div class="asamashi">

  <p class="image">
    <a href="http://www.amazon.co.jp/gp/redirect.html%3FASIN=4873110270%26tag=hail2unet-22%26lcode=xm2%26cID=2025%26ccmID=165953%26location=/o/ASIN/4873110270%253FSubscriptionId=08PWFCAAQ5TZJT30SKG2">
      <img alt="JavaScript" src="http://images.amazon.com/images/P/4873110270.09._SCMZZZZZZZ_.jpg" width="109" height="140" />
    </a>
  </p>

  <h4 class="title">
    <a href="http://www.amazon.co.jp/gp/redirect.html%3FASIN=4873110270%26tag=hail2unet-22%26lcode=xm2%26cID=2025%26ccmID=165953%26location=/o/ASIN/4873110270%253FSubscriptionId=08PWFCAAQ5TZJT30SKG2">JavaScript</a>
  </h4>

  <ul>
    <li>デイビッド フラナガン、 David Flanagan、 村上 列、 垰井 正雄、 安藤 進</li>
    <li>オライリー・ジャパン</li>
    <li>2000-12</li>
    <li>¥ 4,410</li>
  </ul>

</div>

横にあふれないサンプル

a
b
c
d
e
f
g
h