top button
Flag Notify
    Connect to us
      Site Registration

Site Registration

What is CSS Viewport Units?

0 votes

What is CSS Viewport Units?     

  CSS3 Viewport units: vw, vh, vmin, vmax.

  CSS3 has some new values for sizing things relative to the current viewport size: vw, vh, and vmin. It is relevant to bring up now, because it's shipping in Chrome 20 

  One unit on any of the three values is 1% of the viewport axis. "Viewport" == browser window size == window object. If the viewport is 40cm wide, 1vw == 0.4cm.

Viewport unit syntax

In brief, the available new units are as follows:

  • 1vw: 1% of viewport width
  • 1vh: 1% of viewport height
  • 1vmin: 1vw or 1vh, whatever is smallest
  • 1vmax: 1vw or 1vh, whatever is largest

Note that IE9 supports the old syntax for vmin — vm, but not for font-size. Webkit-based browsers that support it do so, but not dynamically — refresh the browser window if you see no change upon resizing the viewport.


Video for Css Viewpot


posted Jun 25, 2015 by anonymous

  Promote This Article
Facebook Share Button Twitter Share Button LinkedIn Share Button