CodePen

HTML

            
              <a href="javascript:(function(){var box = document.createElement( 'div' );box.style.cssText = 'background-color: blue; position: absolute; height: 60%; width: 60%; left: 20%; top: 20%; z-index: 10000';document.body.innerHTML = box.outerHTML;})()"> BLUE BOX </a>
<p> Drag this blue box to your bookmarklet bar, and click when you are in dire need of a blue box!</p>
            
          
!

↑ Insert the most common viewport meta tag

CSS

            
              a
  background-color: blue
  text-decoration: none
  font-size: 12px
  text-indent: -10000px
  position: absolute
  height: 60%
  color: #fff
  width: 60%
  left: 20%
  top: 20%
  
p
  width: 400px
  margin: auto
  padding-top: 20px
  text-align: center
            
          
!
? ?
? ?
Must be a valid URL.
+ add another resource
via CSS Lint

JS

            
              
            
          
!
Must be a valid URL.
+ add another resource
via JS Hint
Loading ..................