The forums ran from 2008-2020 and are now closed and viewable here as an archive.
Home › Forums › CSS › [Solved] creating a simple testimonials box
So I’ve gotten a fairly basic looking testimonials box here: http://jsfiddle.net/magician11/g5DBA/
How do I get the down arrow to not be filled.. and maybe not have the top border on it so the border of the full testimonials box is one line?
That’s actually tricky.
I see you are using a div to create the triangle…In general I wouldn’t do that.
Use a pseudo element instead. You still come up with the same problem but you don’t have unnecessary HTML in your mark-up.
Why tricky…because to create the actual border you would need another triangle (white) inside/over the ‘outer’ triangle to mask it off.
Thanks Paulie_D. Worked perfectly. And yes, I appreciate the point about reducing HTML. I recently learnt about the :before and :after selector and try to use them where I can now.