southernmummy

Thanks!! That has worked, drop down colour is now the same!

I managed to add excerpts using a wp plugin, The only thing I don’t like now is the double horizontal lines between the excerpts. I have tried playing around with some hr custom css but nothing seems to change the style/colour. Could you let me know what code I need to use to change these, please?

Kindest
H

Thanks again steve, no it hasn’t changed a thing. I had another play and have used a custom image now, the only way i could get rid of the stubbon quote. I havent got an after quote, but it kinda looks OK. Think I mightcome back to it another time ??

Hi

Steve, I’m pretty sure I understndwhat you mean and played about with the content value. This is what I have tried and its not working:

.article blockquote {
position: relative;
marign: 0;
padding: 30px 120px;
text-align: center;
font-size: 30px;
color:#F2495D;
*/TRIED ADDING CONTENT: HERE JUST IN CASE

}
.article blockquote:before, .article blockquote:after {

position: absolute;
width: 60px;
height: 60px;
font-size: 120px;
line-height: 1;
*/TRIED ADDING CONTENT: HERE JUST IN CASE
}

.article blockquote:before {
top: 0;
left: 0;
content: “\201C”; */TRIED CHANGING THIS
color: #F2495D;
}
.article blockquote:after {
top: 0;
right: 0;
content: “\201d”; */TRIED CHANGING THIS
color: #F2495D;
}

It seems like thereis a custom ‘quote’ design loaded in because if for instance i do:
.article blockquote:before {
top: 0;
left: 0;
content: “\201D”; – */Change this from C to D, the design still does not match the ‘after’ quote event though the content value is the sameif that makes sense. It can be seen here where they are both set to “\201d”
color: #F2495D;
}
.article blockquote:after {
top: 0;
right: 0;
content: “\201D”;
color: #F2495D;
}

I appreciate your help, although I’m happy to have a play about and try and find my own answers, I’m a bit of a novice with CSS! ??

I’ve been playing around with the CSS most of the afternoon with the help of google.
I have not managed to find away to make the right quote the same as the left, despite my best efforts!

All I managed to do is add an img that seems to overide that specific quote, but this isnt the look I really want. I have changed everything back to how I left it after adding the .article.

Any ideas on how to get my quote marks to match would be very very very much appreciated ??

Thanks Steve,
That has almost worked – I now have pink before and after quotes, but the quotes are different – is there something overiding the style of the first quote mark?
H

Hi Steve,

I didnt have a live page so I have popped a live test on one of my old posts which can be found here

Thanks ??

Hi,
Thankyou, So I had a play around from the site suggested. I actually just popped in the code and added my colour and it looks great so happy with the font etc.

I also nowhave an end quote, but the ‘before’ quote is still centred and grey in colour:

The code I am using is:

p {
    margin-bottom: 30px;
	
}
p:last-child {
    margin-bottom: 0;
}

blockquote {
    position: relative;
    marign: 0;
    padding: 30px 120px;
    text-align: center;
    font-size: 30px;
	  color:#F2495D;
}
blockquote:before, blockquote:after {
    position: absolute;
    width: 60px;
    height: 60px;
    font-size: 120px;
    line-height: 1;
}
blockquote:before {
    top: 0;
    left: 0;
    content: "\201C";
	  color: #F2495D;
}
blockquote:after {
    top: 0;
    right: 0;
    content: "\201D";
		color: #F2495D;
}

Any ideas why its not changing?

• This reply was modified 7 years, 9 months ago by Steven Stern (sterndata).

Hi Steve,
Thanks and sorry – I thought I added my link, must not have pressed the button!
My site is:
https://www.southernmummy.co.uk

Its ok all sorted – I forget to start the image with a transparent background! Doh!!