test for border-color:transparent

testarea

This is test box1, it has a transparent 5px border. The border should be invisible, but present.

This box should be 250px wide, border to border.

This is test box2, it has a coloured 5px border.

This box should be 250px wide, border to border.

code for both boxes

  1. div#box1, div#box2 {
  2. color:#222;
  3. background: #efefef;
  4. padding: 20px;
  5. margin: 20px;
  6. }
  8. div#box1, div#box2 { width: 200px;}
  9. div#box1, div#box2 { \width: 250px;}
  10. div#box1, div#box2 { w\idth: 200px;}

box1

  1. div#box1 {
  2. border: 5px solid transparent;
  3. }

box2

  1. div#box2 {
  2. border: 5px solid #333
  3. }

Comments

Supported by IE5 mac, Mozilla1.0+, Netscape6.2 and 7. IE Win and Opera 5 and 6 do not support this; both display a border with the same color as the foreground-color, as does Safari. [updated] Safari 1.2 supports transparent borders.