1. No Profile Picture
    Contributing User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Oct 2009
    Rep Power

    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:
    <table class="grid">                     	
    <td class="gridDel"><B>Delivery&nbsp;#theNum#&nbsp;&nbsp;:</B></td>                             
    <td class="gridQty">#theQty#</td>                             
    <td class="gridUnit">#theUnit#</td>                             
    <td class="gridDate">#theDate#</td>                         
    The CSS:
    font-family: Arial, Helvetica, sans-serif;                     
    padding:0 0 0 0;                     
    .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.
  2. #2
  3. For POny!
    Devshed Newbie (0 - 499 posts)

    Join Date
    Apr 2012
    Rep Power
    try as a test to put a reset.css above your normal css.
    See if that helps.

IMN logo majestic logo threadwatch logo seochat tools logo