Twitter Bootstrap Modal Issue

by Lyndsy Simon

HTML

<script src="http://twitter.github.com/bootstrap/assets/js/bootstrap-modal.js"></script>
<link rel="stylesheet" href="http://twitter.github.com/bootstrap/assets/css/bootstrap.css">
<a class="btn" data-toggle="modal" href="#myModal" >Launch Modal</a>

<div class="modal hide fade" id="myModal">
  <div class="modal-header">
    <a class="close" data-dismiss="modal">×</a>
    <h3>Modal header</h3>
  </div>
  <div class="modal-body">
    Test.
  </div>
  <div class="modal-footer">
    <a href="#" class="btn">Close</a>
    <a href="#" class="btn btn-primary">Save changes</a>
  </div>
</div>

CSS

.formula {
    height:50px;
    font-family: Arial, sans-serif;
    line-height:50px;
}

.formula div {
    height:100%;
    float:left;        
}

.formula .equality {
    padding:0 5px;
}

.formula .numerator,
.formula .denominator {
    height:24px;
    line-height:24px;
    float:left;
    clear:left;
    width:100%;
    text-align:center;
}

.formula .numerator {
    border-bottom: 1px solid black;
}