SubtractJS Update

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 http://g.grax.com/KhXlha

Home
Improve Your Life
Improve Your Team
Improve Your Code
Opinion
Software Projects
Foo Network