Block Table not decreases width
Remains adjustable
by Rafael Braga
HTML
<div class="table node1" style="left: 583px; top: 121px;">
<div class="td title">Test - Test</div>
<div class="td body">Test Operation</div>
<div class="td body">Test Type Operation</div>
<div class="td body">Test Operation</div>
<div class="td body">Test Operation</div>
<div class="td body">Test Type Operation</div>
<div class="td body">Test Type Operation</div>
<div class="td body foot">Test Operation Raise now</div>
</div>
CSS
html, body {
padding:0px;
margin:0px;
width: 3300px;
height: 5000px;
}
.table {
display: table;
position:absolute;
cursor:pointer;
border: 1px solid #ffffff;
border-radius: 10px;
font-family: 'Proxima Nova Bold',"Segoe UI",Roboto,"Droid Sans","Helvetica Neue",Arial,sans-serif;
font-style: normal;
font-size: 70%;
background: #E8EDFF;
}
.td {
padding-top: 4px;
padding-bottom: 4px;
padding-left: 7px;
padding-right: 7px;
background: #E8EDFF;
border: 1px solid #ffffff;
}
.title {
border-top-left-radius: 10px;
border-top-right-radius:10px;
background: #B9C9FE;
color: #039;
font-weight: bold;
}
.body {
color: #669;
}
.body:hover {
background: #d0dafd;
}
.foot {
border-bottom-left-radius: 10px;
border-bottom-right-radius:10px;
}
JavaScript
$('.node1').draggable();