[Support request] Down arrow on section bottom Deom

[Todd]

How did you achieve the down arrow that is attached to the gray section header On your demo page. I thought it might be a :after CSS but I couldn’t quite find it

It is the section that says “Responsive, Free WordPress Theme GeneratePress is fast, powerful and easy to use!

Thank you

[Leo]

Hi there,

It’s actually a background image added to the section below. Here is the CSS:

.home-info-section {
    background-image: url(https://generatepress.com/wp-content/uploads/2015/05/arrow.png)!important;
    background-repeat: no-repeat;
    background-position: center top;
    background-size: auto;
}

[Todd]

Thank you, very helpful. Have you seen this done with a font awesome Icon so I could easily change the font ize and the color? http://fontawesome.io/icon/caret-down/

[Leo]

No I haven’t but I’d assume it’s possible with some tweaks.

Show me what you have if you get stuck and I’ll see if I can help with some CSS 🙂

[Author]

Posts