Question

On this page I”ve been working on forever, I have this column headed “Bid x Ask”: http://www.sellmycalls.com/so-bg-pos.png

in each of whose cell backgrounds there is supposed to be a bar chart that conveys the ratio of the numbers in the cell to each other.

So in each cell I have a background-color: gray; and a background-image:all-white;. I can’t properly position the (plenty big enough) image on the gray background. In fact, in its current incarnation, the image doesn’t show up at all.

How can I properly set the background-position of the image? The top <td> in the column is styled this way:

   <td class="main_td bxa bxa_val"
   style="background-color: #ecf1ef;
          background-image:url('http://www.sellmycalls.com/pics/cell/bxa-white.png');
          background-repeat:repeat-x repeat-y;
          background-origin: 0px 0px;
          background-attachment:fixed;
          background-position:53px 0px;
     -moz-background-position:53px 0px;
  -webkit-background-position:53px 0px;
   -khtml-background-position:53px 0px;
  -o-user-background-position:53px 0px;">
    <div>&nbsp;543 x 470</div></td>

Thanks so much for your help!

Answer 1

Your image is 49x1px which I think is showing, however, with Firebug your TD shows a style of background-repeat:repeat-x; X not Y as you show in your example code snippet above.

UPDATE:

Try

style="background-color:#ecf1ef;
       background-image:url('http://www.sellmycalls.com/pics/cell/bxa-white.png');
       background-position:50px 0px;
       background-repeat:repeat-y;"

• you cannot adjust the dimensions of the image so (1) always make the image at least as wide as the TD itself (i.e. wider than 49px) and always use the background-image as the right hand side bar and the background-color for the left side bar. I hope this is all clear