How do I make this code smaller and better?

anybody?

[cicru]

Just started using CSS ...
(it is like learning to write again)

Is there any way to make this code smaller any better
Value A and B have to be aligned under each other and value C & D have to be aligned to the right .

<div id='boxd'>
<span style="font-size: small;">XXXXXXXXX : &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; Value A<br>XXXXXXXXXX: Value b <br>
<div class="right">
XXXXXXXXXXXXXX&nbsp;&nbsp;&nbsp;Value C </div> </span>
<span style="font-size: medium;">XXXXXXXXXXXXX</span>
<span style="font-size: xx-small;">
<span style="font-size: medium;" class="right">
<a href='$durl'>
<div class="right">Value D</div>
</a> </span> <br>
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXx
</span>
</div>

[katana_one]

I'm not sure exactly what you are trying to do here.

Are the strings of Xs supposed to be part of the design?

Do all the non-breaking spaces mean you are trying to align Value A and Value B to the right?

You say A and B are aligned under each other, but do not say if they are aligned left, right, or center.

I'm sure either I or someone else can help, but your post is not clear on the objective.

[g1smd]

Maybe it would help if you used normal pargraph elements rather than chucking loads of div and span tags around. Using classes rather than inline styles can also unclutter your code too.