Advanced Search

BlackBerry Logo Use CSS3

/ Published in: CSS
Save to your folder(s)
Hihihihi, just share ;)

Expand | Embed | Plain Text

Copy this code and paste it in your HTML 
  1. <style>
  2. #BBery {
  3. width: 195px;
  4. margin: 0 auto;
  5. -webkit-transform: skew(-10deg, 0deg);
  6. -moz-transform: skew(-13deg, 0deg);
  7. -ms-transform: skew(-13deg, 0deg);
  8. -o-transform: skew(-13deg, 0deg);
  9. transform: skew(-13deg, 0deg);
  10. overflow: hidden
  11. }
  12. #BBery .bb {
  13. background: black;
  14. width: 55px;
  15. height: 40px;
  16. margin: 13px 10px 0px 0px;
  17. -webkit-border-radius: 0px 25px 20px 0px;
  18. -moz-border-radius: 0px 25px 20px 0px;
  19. border-radius: 0px 25px 20px 0px;
  20. display: block
  21. }
  22. #BBery .left {float: left}
  23. #BBery .right {float: right}
  24. </style>
  25.  
  26. <div id='BBery'>
  27.     <div class='left'>
  28.         <div class='bb'></div>
  29.         <div class='bb'></div>
  30.     </div>
  31.     <div class='right' style='position:relative;top:35px;'>
  32.         <div class='bb'></div>
  33.         <div class='bb'></div>
  34.  
  35.     </div>
  36.     <div class='right'>
  37.         <div class='bb'></div>
  38.         <div class='bb'></div>
  39.         <div class='bb'></div>
  40.     </div>
  41. </div>

URL: http://embah-google.blogspot.com/2012/03/blackberry-logo-use-css3.html

Report this snippet


Comments

RSS Icon Subscribe to comments

You need to login to post a comment.