I just noticed my sample in the post above got all screwed up with the formatting I used… what is the recommended way to post HTML snippets in this forum?
Well, if you go to the source of the homepage of the site linked above, you will see a div element with class “ribbon-edge-bottomleft”. This has the following CSS:
position: absolute; z-index: 1; border-style: solid;
height: 0px; width: 0px;
border-width: 0px 10px 10px 0px;
border-color: transparent #591E36 transparent transparent;
This is a neat trick to create that 3D “folded ribbon” effect. I uses several bits of CSS to work, some on the title itself, some on this div below, some drop-shadows in several places, etc.
I was able to recreate this in GeneratePress for static pages, and sections, but on the sidebar widgets I can’t because the CSS has to apply to something below the title (but something extra there, just the text below won’t do – that’s why pseudo-selectors can’t do it either).
I need to start the widget content by adding an HTML div with class “ribbon-edge-bottomleft” right below the h4 title, but before whatever comes next in the widget content…
I really appreciate your help, Tom.