Changing Price tags

HTML & CSS
1

I am using a theme here http://www.ariettamusic.co.uk and the price tags cover too much of the pictures. I am a beginner with css but I am always eager to try anything so can anyone help or suggest what to do to solve the price tag issue and will it be easy to change on the css / html side of things?

Many thanks for your suggestions

2

Hey hantaah,

I’m also a beginner with CSS, but I think the issue with the price tag isn’t only CSS-related. It seems that the first step you have to do is to edit the image “http://www.ariettamusic.co.uk/wp-content/themes/Boutique/images/price-area.png” as you would like it to appear.

Then after you edit that picture in Photoshop or your preferred application, edit “.featured-price” in your theme’s CSS (http://www.ariettamusic.co.uk/wp-content/themes/Boutique/style.css) so that it matches the picture how you just edited it.

Like I said, I’m a beginner at this as well, but I think that’s the solution. :slight_smile:

3

Sorry, please ignore my previous post.

There IS an easier CSS-only solution. In your theme’s CSS (http://www.ariettamusic.co.uk/wp-content/themes/Boutique/style.css), just change

.featured-price {
background: url(images/price-area.png) no-repeat;
width: 283px;
height: 85px;
position: absolute;
left: 52px;
bottom: -39px;
text-shadow: 1px 1px 1px rgba(0,0,0,0.2);
}

TO…

.featured-price {
background: url(images/price-area.png) no-repeat;
width: 283px;
height: 85px;
position: absolute;
left: 52px;
[B]bottom: -55px;[/B]
text-shadow: 1px 1px 1px rgba(0,0,0,0.2);
}

Change the number in “bottom: -39px;” according to whatever suits your taste. The lower the number, the lower the image will appear. I tried -55px, but you might like it differently. :slight_smile:

4

Yea thanks Pamela1991. When i read your first answer i thought of course so obvious why did I not think of it like that then the 2nd answer I thought how simple, hoorah for css. Thanks for that.

I might try and edit the tag to a smaller scale and try to fit it to the bottom though, I will have a play around.

Many thanks

5

No problem. I’m glad I was able to help. :slight_smile: I’m pretty new at sitepoint, but I’ve already received so much excellent help! :slight_smile:

6

I’ve searched through the best of the forums and sitepoint is by faaaaaaaaarr the best!!!

7

Yeah! :slight_smile: Just before reading this post I also said the same thing in another thread: