David Walker

SubtractJS Update

by David Walker

Some of you already know how amazing SubtractJS 1.0 is, but now I have something else to add to it. With SubtractJS 1.0.1, you can add an additional class "sj-margin-box-model" to make it easy to set up percentage-based sections.

For example, here is a box split into 4 row of 25 percent each, with margins and borders.

<style>
.fourRow{
  height: 25%;
  border: 1px solid black;
  margin: 2px;
  padding: 2px;
}
</style>

<div style="background: #CCCCCC; height: 100px; position: relative; width: 200px;">
 <div class="sj-fill-top sj-margin-box-model fourRow"></div>
 <div class="sj-fill-top sj-margin-box-model fourRow"></div>
 <div class="sj-fill-top sj-margin-box-model fourRow"></div>
 <div class="sj-fill-top sj-margin-box-model fourRow"></div>
</div>



or here is a box split into 5 columns of 20 percent each, again with margins and borders.

<style>
.fiveCol{
  width: 20%;
  border: 1px solid black;
  margin: 2px;
  padding: 2px;
}
</style>
<div style="background: #CCCCCC; height: 100px; position: relative; width: 200px;">
 <div class="sj-fill-left sj-margin-box-model fiveCol"></div>
 <div class="sj-fill-left sj-margin-box-model fiveCol"></div>
 <div class="sj-fill-left sj-margin-box-model fiveCol"></div>
 <div class="sj-fill-left sj-margin-box-model fiveCol"></div>
 <div class="sj-fill-left sj-margin-box-model fiveCol"></div>
</div>


Get the update via NuGet or download it from CodePlex at (Link Unavailable)

David Walker

David Walker is a Software Consultant, Photographer, and Digital Artist based out of Orlando, Florida, USA.

He believes in secure reliable software and productive happy teams.

More ...