CODEWITHSUNDEEP
htmlcss
william007
william007

Reputation: 18543

two strange lines when hover

When I mouse over on a pure html/css site here: https://unruffled-shaw-39b759.netlify.app/

CSS is in this link - https://unruffled-shaw-39b759.netlify.app/css/style.css

I have two strange lines as below

enter image description here

How to get rid of it?

Upvotes: 1

Views: 106

Answers (2)

Ved
Ved

Reputation: 746

You can remove backface-visibility: hidden; from

.story__img {
    height: 100%;
    transform: translateX(-4rem) scale(1.4);
    backface-visibility: hidden;
    transition: all 0.5s;
}

This will work.

Upvotes: 0

Nabeel Khan
Nabeel Khan

Reputation: 3993

It is because of skew and then de-skew probably.

You can fix it by adding: overflow: hidden; for story__shape

Add this:

.story__shape {
    overflow: hidden;
}

Upvotes: 1

Related Questions