Two definition lists side by side

[Eiolon]

I am trying to make it so two definiton lists are side by side instead of on top of each other.  I'm not sure what to do to put them side by side.  Thanks for your help!

 

 

 

My CSS:

 

#summary {
background:#FAFAFA;
border: 1px solid #E8E8E8;
padding:15px 10px 10px 15px;
font-family:Arial, Helvetica, sans-serif;
font-size:13px;
color: #000000;
}

#summary  dl {
clear: both;
}

#summary dt {
    float: left;
    clear: left;
width: 130px;
    text-align: left;
  }

#summary  dd {
    margin: 0 0 0 0;
    padding: 0 0 0.7em 0;
color:#000000;
}

 

and HTML

 

<div id="summary">
<dl>
<dt>Account</dt> <dd>SMALL TOOLS AND EQUIPMENT</dd>
<dt>Code</dt> <dd>503-523</dd>
<dt>Fiscal Year</dt> <dd>2010-2011</dd>
</dl>
<dl>
<dt>Budget Amount</dt> <dd>$10000.00</dd>
<dt>Amount Spent</dt> <dd>$5000.00</dd>
<dt>Amount Remaining</dt> <dd>$5000.00</dd>
</dl>
</div>

[Eiolon]

nvm solved