2

境界線の一部が Safari に表示されない!?

これをチェックしてください。それは非常に奇妙です:

http://jsfiddle.net/myWqs/1/

(Safari / Mac OS X を使用していることを確認してください)

現在別のブラウザを使用している場合のスクリーンショットを次に示します。

ここに画像の説明を入力

そして、ここに再現するための詳細があります(StackOverflowが「jsfiddleにリンクするだけではいけない」と言っているために含まれています)。

HTML:

<h1>Example safari bug with the borders on the .holder divs</h1>
<br/><br/><br/>

<div class="column">
  <div class="holder">
    <h1>Stuff here</h1>
      <p>Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum.</p>
      <p>Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum.</p>
      <p>Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum.</p>
      <p>Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum.</p>
      <p>Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum.</p>
      <p>Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum.</p>
      <p>Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum. Lorum ipsum.</p>
  </div>
</div>

CSS:

.column {
    float: left;
    margin-left: 12px;
    min-width: 250px;
    max-width: 550px;
    width: 50%;
}

.holder {
    background-color: #e8e8e8;
    background: -webkit-gradient(linear, left top, left bottom, from(#e8e8e8), to(#f3f3f3));
    background: -moz-linear-gradient(top, #e8e8e8, #f3f3f3);
    border: 1px solid #333333;
    position: relative;
    line-height: 18px;
    border-radius: 4px;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
}
4

0 に答える 0