JSFiddle - React, Tailwind, and code Playground
by oroce
HTML
<link rel="stylesheet" href="http://twitter.github.com/bootstrap/assets/css/bootstrap.css">
<script src="http://twitter.github.com/bootstrap/assets/js/bootstrap-modal.js"></script>
<div class="row">
<div class="span6"> </div>
<div class="span2"><a class="btn btn-primary" data-toggle="modal" href="#myModal">edit</a></div>
</div>
<div class="row">
<div class="span8">
<form class="form-horizontal">
<fieldset>
<div class="control-group">
<label class="control-label">School name:</label>
<div class="controls">
<span class="input-xlarge uneditable-input">Some value here</span>
</div>
</div>
<div class="control-group">
<label class="control-label">School location:</label>
<div class="controls">
<span class="input-xlarge uneditable-input">Some value here</span>
</div>
</div>
<div class="control-group">
<label class="control-label">School type:</label>
<div class="controls">
<span class="input-xlarge uneditable-input">Some value here</span>
</div>
</div>
<div class="control-group">
<label class="control-label">Story:</label>
<div class="controls">
<textarea class="input-xlarge">Some value here</textarea>
</div>
</div>
</fieldset>
</form>
</div>
</div>
<div id="myModal" class="modal hide fade">
<div class="modal-header">
<button class="close" data-dismiss="modal">×</button>
<h3>
<div class="alert alert-block">
<h4 class="alert-heading">Warning!</h4>
Achtung, it will modify your inventory.
</div>
</h3>
</div>
<div class="modal-body"><form class="form-horizontal">
...