Skip welcome & menu and move to editor
Welcome to JS Bin
Load cached copy from
 
<!DOCTYPE html>
<html>
<head>
<meta name="description" content="cssobj demo">
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width">
  <title>cssobj demo</title>
  <script src="https://unpkg.com/es5-shim"></script>
  <script src="https://unpkg.com/cssobj"></script>
</head>
<body>
  <div>
    Resize this<br>
    width: 50vw<br>
  </div>
</body>
</html>
 
var obj = 
{
  div: {
    backgroundColor: 'yellow',
    color: 'red',
    height: '200px',
    // simulate 50vw in CSS3
    width: function() {
      return document.documentElement.clientWidth/2 + 'px'
    }
  }
}
var result = cssobj(obj)
// dynamic update height when resize
window.onresize = function() { result.update() }
Output

You can jump to the latest bin by adding /latest to your URL

Dismiss x
public
Bin info
futuristpro
0viewers