Issue
I have a parent div that is a tilted box using skew transform. And I also have a child element contains text, but it also get tilted. I tried doing transform: none for the child but it didn't work. (Using svelte)
<div class="tilt">
<p class="remove-tilt">Hello</p>
</div>
<style>
.tilt {
transform: skew(-5deg);
}
.remove-tilt {
transform: none;
}
</style>
Solution
Neutralize the transformation:
.remove-tilt {
transform: skew(5deg);
}
It's probably best to target each element with better selectors.
div .tilt:not(p) {
transform: skew(-5deg);
}
Answered By - HasanTheSyrian_
0 comments:
Post a Comment
Note: Only a member of this blog may post a comment.