Design Team member area | Elementor tutorial

In this quick tutorial I will show you how to design team member area in a different way. And also will add a nice hover effect with that using simple CSS.

Add this class name for each member inner section

team_member

Then use this CSS code

:root{
    --color: red;
    --border_width: 4px;
    --height: 85px;
    --time: 1s;
}

selector:before{
    content: "";
    width: var(--border_width);
    height: var(--height);
    background: var(--color);
    position: absolute;
    right: 0;
    z-index: 0;
    transition:var(--time);
}
.team_member:hover selector:before{
    width: 110%;
}

Start Working with me for any wordpress project!

Get in touch

Have a few questions or just want to say hello? Use the form below to get in touch with me! If you are ready to book a new project please click here to fill out a design inquiry.

Call me by Skype (farjana.rashid55)

14 + 6 =

[wpforms id="2272"]