Skip welcome & menu and move to editor
Welcome to JS Bin
Load cached copy from
 
<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8 />
<title>JS Bin</title>
<!--[if IE]>
  <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
<style>
  body { background-color: blue; }
  
  div.someClassName {
    padding: 20px;
    background-color: yellow;
    background-image: url("yourImageGoesHere.jpg");
    background-repeat: repeat-x;
    border: 5px solid red;
    border-radius: 1em;
    width: 200px;
  }
  .box {
    width: 200px;
  }  
.box_round {
  -webkit-border-radius: 3px; /* Saf3-4, iOS 1-3.2, Android ≤1.6 */
     -moz-border-radius: 3px; /* FF1-3.6 */
          border-radius: 3px; /* Opera 10.5, IE9, Saf5, Chrome, FF4, iOS 4, Android 2.1+ */
  /* useful if you don't want a bg color from leaking outside the border: */
  -moz-background-clip: padding; -webkit-background-clip: padding-box; background-clip: padding-box;
}
.box_gradient {
    
  background-color: #CCCCCC;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#CCCCCC), to(#FFFFFF)); /* Saf4+, Chrome */
  background-image: -webkit-linear-gradient(top, #CCCCCC, #FFFFFF); /* Chrome 10+, Saf5.1+, iOS 5+ */
  background-image:    -moz-linear-gradient(top, #CCCCCC, #FFFFFF); /* FF3.6 */
  background-image:     -ms-linear-gradient(top, #CCCCCC, #FFFFFF); /* IE10 */
  background-image:      -o-linear-gradient(top, #CCCCCC, #FFFFFF); /* Opera 11.10+ */
  background-image:         linear-gradient(to bottom, #CCCCCC, #FFFFFF);
}
</style>
</head>
<body>
  <div class="box_gradient box_round box">
    yxcvyxcvyxcv<br>
    yxcvyxcvyxcv<br>
    yxcvyxcvyxcv<br>yxcvyxcvyxcv<br>
    yxcvyxcvyxcv<br>
    yxcvyxcvyxcv<br>
  </div>
</body>
</html>
 
if (document.getElementById('hello')) {
  document.getElementById('hello').innerHTML = 'Hello World - this was inserted using JavaScript';
}
Output

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

Dismiss x
public
Bin info
anonymouspro
0viewers