css - Rotate div whitouth breaking structure -


i'm trying keep rotated block align on top of remaining blocks in right side of window.

fiddle: https://jsfiddle.net/8tbl6rqs/1/

<div class="side">     <div class="block-first">chat us</div>     <div class="block">phone</div>     <div class="block">mail</div>   <div>  .side {     position:absolute;     right:0px;     margin-top:30%; }  .block, .block-first {     background: #f00;     display: block;     height: 50px;     width:50px;     text-align:center;     line-height:50px; }  .block-first {     width:200px!important;     transform: rotate(-90deg); } 

add following css .block-first:

position:relative; top:-75px; left:-75px; 

here's updated fiddle.


Comments

Popular posts from this blog

c# - Binding a comma separated list to a List<int> in asp.net web api -

Delphi 7 and decode UTF-8 base64 -

html - Is there any way to exclude a single element from the style? (Bootstrap) -