Joomla Templates Club 406,261 posts

[baud Friend baudJoin date: September 2010Posts: 61Downloads:22Uploads:10 Thanks: 18]

#199867

How can I add that little arrow (pointing downwards below the title) that the “Fun Facts” (from the demo site) module has to the JA Masshead module?

---

Attachments:

1. 

[TomC Moderator TomCJoin date: October 2014Posts: 14077Downloads:58Uploads:137 Thanks: 948 Thanked: 3155 times in 2495 posts]

#543042

That effect is created via some creative CSS border properties – as follows:


.row-feature.row-feature-highlight-title .row-feature-title:before {
border-left: 10px solid rgba(0, 0, 0, 0);
border-right: 10px solid rgba(0, 0, 0, 0);
border-top: 10px solid #1bbc9b
bottom: 0;
content: "";
height: 0;
left: 50%;
margin-bottom: -10px;
margin-left: -10px;
position: absolute;
width: 0;
}

You can try pasting the above within your custom.css file (file path –> /templates/ja_sugite/css/custom.css)

[yangyangli Friend yangyangliJoin date: July 2014Posts: 72Downloads:0Uploads:39 Thanks: 22 Thanked: 12 times in 1 posts]

#543142

How does

border-left: 10px solid rgba(0, 0, 0, 0);
border-right: 10px solid rgba(0, 0, 0, 0);
border-top: 10px solid #1bbc9b
create an arrow? That’s amazing.

[TomC Moderator TomCJoin date: October 2014Posts: 14077Downloads:58Uploads:137 Thanks: 948 Thanked: 3155 times in 2495 posts]

#543143

You can always inspect the CSS on the demo via and see for yourself. 😎

[baud Friend baudJoin date: September 2010Posts: 61Downloads:22Uploads:10 Thanks: 18]

#543146

I created a custom.css and added the above mentioned code. Do I also need to assign a class suffix to the Masshead module? I tried to do that but without success.

http://projekt2014.hebel-gymnasium-loerrach.de/index.php/bilder

[TomC Moderator TomCJoin date: October 2014Posts: 14077Downloads:58Uploads:137 Thanks: 948 Thanked: 3155 times in 2495 posts]

#543147

Do me a favor and temporarily set “Optimize CSS” to “Off” within your Template Manager–General settings

[baud Friend baudJoin date: September 2010Posts: 61Downloads:22Uploads:10 Thanks: 18]

#543148

done! thanks for your help!

[TomC Moderator TomCJoin date: October 2014Posts: 14077Downloads:58Uploads:137 Thanks: 948 Thanked: 3155 times in 2495 posts]

#543149

<em>@baud 437745 wrote:</em><blockquote>I created a custom.css and added the above mentioned code. Do I also need to assign a class suffix to the Masshead module? I tried to do that but without success.

http://projekt2014.hebel-gymnasium-loerrach.de/index.php/bilder</blockquote>

Not seeing your custom.css file . . . . what is the file path you have it within?

[baud Friend baudJoin date: September 2010Posts: 61Downloads:22Uploads:10 Thanks: 18]

#543150

like you said: /templates/ja_sugite/css/custom.css

[Author]

Posts