DaveDev DaveDev - 1 year ago 43
CSS Question

How to align this span to the right of the div?

I have the following HTML:

<div class="title">
<span>Cumulative performance</span>

with this CSS:

display: block;
border-top: 4px solid #a7a59b;
background-color: #f6e9d9;
height: 22px;
line-height: 22px;
padding: 4px 6px;
font-size: 14px;
color: #000;
margin-bottom: 13px;

If you check this jsFiddle:

you can see that the Name & Date are stuck together. Is there a way that I can get the date to align to the right? I've tried
float: right;
on the second
but it screws up the style, and pushes the date outside of the enclosing div

Answer Source

If you can modify the HTML: http://jsfiddle.net/8JwhZ/3/

<div class="title">
  <span class="name">Cumulative performance</span>
  <span class="date">20/02/2011</span>

.title .date { float:right }
.title .name { float:left }