Web Browser Support For Miscellaneous CSS Selectors, Styles, Properties, Values, And Units: Tests And Results

  1. Web Browser Support For The background: linear-gradient() Style: Test And Result
  2. Web Browser Support For The border-radius Property: Test And Result
  3. Web Browser Support For The box-shadow Property: Test And Result
  4. Web Browser Support For The rem Unit: Test And Result
  5. Web Browser Support For The text-shadow Property: Test And Result
  6. Web Browser Support For The vh Unit: Test And Result
  7. Web Browser Support For The vw Unit: Test And Result

1. Web Browser Support For The background: linear-gradient() Style: Test And Result

Test CSS

.background-linear-gradient {
  background: linear-gradient(#777 0%, #fff 33%, #fff 67%, #777 100%);
}

Test HTML

<p class="background-linear-gradient">Paragraph styled with <code>background: linear-gradient(#777 0%, #fff 33%, #fff 67%, #777 100%);</code>.</p>

Test

Paragraph styled with background: linear-gradient(#777 0%, #fff 33%, #fff 67%, #777 100%);.

Result

Web browser support for the background: linear-gradient() style: IE10+, ED12+, FF16+, Not SF5.1.7-, CH26+, OP12.10+.

2. Web Browser Support For The border-radius Property: Test And Result

Test CSS

.border-radius {
  border-radius: 5px;
  border: 1px solid black;
}

Test HTML

<p class="border-radius">Paragraph styled with <code>border-radius: 5px; border: 1px solid black;</code>.</p>

Test

Paragraph styled with border-radius: 5px; border: 1px solid black;.

Result

Web browser support for the border-radius property: IE9+, ED12+, FF4+, SF5+, CH4+, OP10.50+.

3. Web Browser Support For The box-shadow Property: Test And Result

Test CSS

.box-shadow {
  box-shadow: 5px 5px 5px 5px #777;
  border: 1px solid black;
}

Test HTML

<p class="box-shadow">Paragraph styled with <code>box-shadow: 5px 5px 5px 5px #777; border: 1px solid black;</code>.</p>

Test

Paragraph styled with box-shadow: 5px 5px 5px 5px #777; border: 1px solid black;.

Result

Web browser support for the box-shadow property: IE9+, ED12+, FF4+, SF5.1+, CH10+, OP10.50+.

4. Web Browser Support For The rem Unit: Test And Result

Test CSS

html {
  font-size: 16px;
}
.two-rem {
  font-size: 2rem;
}

Test HTML

<p class="two-rem">Paragraph styled with <code>font-size: 2rem</code>. <span class="two-rem">Span styled with <code>font-size: 2rem</code>.</span> Paragraph styled with <code>font-size: 2rem</code>.</p>

Test

Paragraph styled with font-size: 2rem. Span styled with font-size: 2rem. Paragraph styled with font-size: 2rem.

Result

Web browser support for the rem unit: .

5. Web Browser Support For The text-shadow Property: Test And Result

Test CSS

.text-shadow {
  text-shadow: 5px 5px 5px #777;
}

Test HTML

<p class="text-shadow">Paragraph styled with <code>text-shadow: 5px 5px 5px #777;</code>.</p>

Test

Paragraph styled with text-shadow: 5px 5px 5px #777;.

Result

Web browser support for the text-shadow property: IE10+, ED12+, FF3.5+, SF3.1+, CH2+, OP10+.

6. Web Browser Support For The vh Unit: Test And Result

Test CSS

.vh {
  height: 50vh;
  border: 1px solid black;
}

Test HTML

<p class="vh">Paragraph styled with <code>height: 50vh; border: 1px solid black;</code>.</p>

Test

Paragraph styled with height: 50vh; border: 1px solid black;.

Result

Web browser support for the vh unit: IE9+, ED12+, FF19+, Not SF5.1.7-, CH19+, OP15+.

7. Web Browser Support For The vw Unit: Test And Result

Test CSS

.vw {
  width: 50vw;
  border: 1px solid black;
}

Test HTML

<p class="vw">Paragraph styled with <code>width: 50vw; border: 1px solid black;</code>.</p>

Test

Paragraph styled with width: 50vw; border: 1px solid black;.

Result

Web browser support for the vw unit: IE9+, ED12+, FF19+, Not SF5.1.7-, CH19+, OP15+.

Last reviewed/updated: 10 Nov 2017 | Published: 26 Oct 2016 | Status: Active

Learn Web Coding

Valid HTML5 Valid CSS Level 3