January 2nd, 2013, 07:40 AM
|
|
Contributing User
|
|
Join Date: Oct 2009
Posts: 59
Time spent in forums: 11 h 27 m 24 sec
Reputation Power: 4
|
|
|
Intraline: 3 items left-aligned, 1 right-aligned
I have 4 elements - 1, 2, 3, 4 - where 1,3 & 4 are left aligned whilst 2 (theQty) is a number and needs to be right-aligned. I've tried many potential solutions I found on the web without success. I ended up trying <table> and it works up to a point. I used jsfiddle to tune it and it works perfectly there but I'm not making it for browser display, it's creating a pdf for printing. My FLASH program calls a coldfusion CFC which builds the pdf by looping through a structure containing "records" sent by the FLASH program. My requirement is for 1 type of record which could exist multiple times. Since the results through a browser are ok but the pdf is not, puts me in a quandry - is it a css problem or coldfusion problem?
The html:
Code:
<table class="grid">
<tr>
<td class="gridDel"><B>Delivery #theNum# :</B></td>
<td class="gridQty">#theQty#</td>
<td class="gridUnit">#theUnit#</td>
<td class="gridDate">#theDate#</td>
</tr>
</table>
The CSS:
Code:
.grid
{
font-family: Arial, Helvetica, sans-serif;
font-size:12px;
border:none;
padding:0 0 0 0;
margin:0px;
}
.gridDel {text-align:left; font-weight:bold; padding:0 10px 0 0;}
.gridQty {text-align:right; width:30px; padding:0 0 0 0; }
.gridUnit {text-align:left; padding:0 0 0 3px; }
.gridDate {text-align:left; padding:0 0 0 px; }
My issue is that each row begins slightly indented on the left and, since each row is a separate table, there is a blank line between each row - tolerable but I'd rather they weren't there. If someone has a way of "fixing" my table or, better still, a non-table solution, I'd love to hear it! HTML/CSS is still new to me.
|
Del.icio.us
Digg
Google
Spurl
Blink
Furl
Simpy
Y! MyWeb
Linear Mode
