Several related questions regarding setting up a category flow.
“Portfolio” in the main Nav should link to a landing page with all our project categories. This works. But then I’d like each category photo to link to its respective category. How?
Is there a way to center text vertically in a text box which covers 100% of the container behind it? I want a hover effect that when you roll over the photo, the whole photo grays out, with text in the center.
- I’ve tried using a very large line height, which works… until you have text that needs to wrap
- I’ve used the 50%/-50% spacing trick, but this makes a small text box which does not cover the whole photo
- I’ve tried placing a div block behind the text and doing a hover effect on both, but this produces a sequential-hover effect (whole photo grays out, then only the space behind the text grays out) which is not what I want.
You can see the flow & styling working the way I want here (ignore the hover styling on this page; click on any sub-page to see what I’m trying to do): https://sdg785.wixsite.com/sdgarch/portfolio