Skew columns

Hi,

On this page - http://blenckerspersonaltraining.nl/test/ - I have added a skew to the second section. I have used this code for it:
/* Skew a section */ .skew-box { -moz-transform: skewX(-15deg); -ms-transform: skewX(-15deg); -o-transform: skewX(-15deg); -webkit-transform: skewX(-15deg); transform: skewX(-15deg); margin:-2% 0!important; } .skew-box> *{ -moz-transform: skewX(15deg); -ms-transform: skewX(15deg); -o-transform: skewX(15deg); -webkit-transform: skewX(15deg); transform: skewX(15deg); }

Now what I would like to accomplish is that the left x of Column 1 and the right x of Column 2 are straight i.e. are not skewed. I tried some code I found from another source but that didn’t work, and I’m not fluent in this. Can anyone help me?

Hey @yingfuli,

Instead of using CSS, I’d recommend that you use PNG image for this.

If you wish to use CSS, please note that this is outside the scope of our support. I will give you an example on how to achieve this in the builder but please note that we could not continue on providing custom code.

Please see the sample setup in this setup demo.

There might several other methods to achieve this but it would require a fair amount of time to test especially for your own specific needs. This is why it’s recommended that you hire a third party web developer to work closely on your project for this types of CSS effects.

Thank you for understanding.

Used Rev Slider instead. Thanks though.

Glad we could help.

Cheers!

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.