I have two download links as follows:

1. <a class="artbutton" href=""><span>CV</span></a>
 and, 2. <a class="artbutton" href=""><span>Company Profile</span></a> in PDF form.

I'm expecting to get '1.' followed by the two buttons seperated by 'and, 2.' and followed by 'in PDF form'.

What I'm actually getting is the two buttons together follwed by '1. and, 2. in PDF form'.

Hope that makes sense.

What I want is <text> button <more text> button <ending text>.

What I'm getting is button button <text> <more text> <ending text>.

My CSS is as follows:

.artbutton {
  background-image: url("images/Buttonr.png");
  background-attachment: scroll;
  background-repeat: no-repeat;
  background-position: top right;
  display: inline-block;
  text-decoration: none;
  color: #fff;
  float: left;
  padding-right: 8px;
  padding-top: 2px;
  padding-bottom: 12px;
  margin-right: 20px;
.artbutton span{
  background-image: url("images/Buttonl.png");
  background-repeat: no-repeat;
  padding: 4px 0 16px 8px;
4 Years
Discussion Span
Last Post by davecoventry

With the code sample you provided, it seems to me that the text would be placed on top of the buttons. i copied and pasted your code and just used a random image as a button. seems to work for me.

Do you have a link so I can see the site online?

or do you have the html? if there is too much code, you can put this on jsfiddle as well so we can see it online.

This topic has been dead for over six months. Start a new discussion instead.
Have something to contribute to this discussion? Please be thoughtful, detailed and courteous, and be sure to adhere to our posting rules.