#134207 Blog post tile: whole element clickalbe

Landing Forums JupiterX WordPress Theme Blog post tile: whole element clickalbe

Viewing 9 posts - 1 through 9 (of 9 total)
  • Author
    Posts
  • Sar Whi

    Dear team, I am using a blog post element on my website. For example on the homepage. I modified the look of it and have the post title visible on the picture. Unfortunately the whole element is not clickable with a link, only if I click the text directly which is not very convenient. Could you let me know how to make the whole element clickable with the link to the appropriate post? thank you.

    Private
    Sar Whi
    This reply has been marked as private.
    Nodari Support Team

    Hi Sara

    Try this code:

    .raven-post-wrapper .raven-post-title a {
        color: #02010100;
        display: block;
        background: #559855;
        width: 100%;
        height: 100%;
        bottom: 0px;
        padding-top: 20%;
        padding-left: 10px;
    }
    .raven-post-wrapper .raven-post-title {
        position: absolute;
        height: 100%;
        width: 100%;
    }
    .raven-post-inside .raven-post-content {
        position: relative;
        width: 100%;
        width: 100%;
        height: 100%;
        position: absolute;
    }

    Regards

    Private
    Sar Whi
    This reply has been marked as private.
    Amir Rather Support Team

    Hi Sar

    The screenshot seems to be missing kindly reattach it.

    Regards

    Private
    Sar Whi
    This reply has been marked as private.
    Mohsin Al-Rabieai Support Team

    Hi Sarah,

    Would you please try this CSS instead?

    .raven-post-wrapper .raven-post-title a {
        display: flex;
        text-align: center;
        justify-content: center;
        align-self: center;
        align-content: center;
        align-items: center;
        transition: 0.3s all;
        width: 100%;
        height: 100%;
    }
    
    .raven-post-wrapper .raven-post-title {
        height: 100%;
        width: 100%;
        display: flex;
    }
    
    .raven-post-inside .raven-post-content {
        height: 100%;
        display: flex;
        position: absolute;
    }

    Generally, I won’t recommend using a CSS fix to achieve this look. But this is the fastest way if it’s the only change you are going to make on your Posts widget.

    Bests

    Private
    Sar Whi
    This reply has been marked as private.
    Amir Rather Support Team

    You’re most welcome ūüôā

Viewing 9 posts - 1 through 9 (of 9 total)
You must be logged in to reply to this topic.
Login