Thanks for taking the time to reply . I managed to achieve the effect I was looking for, before I had a chance to read this reply. However you did give me some ideas for other things I wanted to try.
I was able to achieve the effect based on the advice given to me on the other site and some modifications I had to find with trial and error. Here is the code below in case it might help someone in the future. I only tested it on chrome, firefox and safari, all recent versions as of this post. Not sure what issues I will run into with other versions or IE.
<img src="images/logo.png" />
margin: 0 auto;
background:url(../images/arrow_tip.png) no-repeat top left;
padding: 0 0 0 120px;
background:url(../images/arrow_tail.png) repeat-x top left;