Your achievements

Level 1

0% to

Level 2

Tip /
Sign in

Sign in to Community

to gain points, level up, and earn exciting badges like the new
Bedrock Mission!

Learn more

View all

Sign in to view all badges

SOLVED

How to create a certain angle on pixel difference on a image text using image component

srinivas_chann1
Level 7
Level 7

Hi,

 

I have to create a angle of 45* degree cut at the edge of an text and also 100 pixel distance  using the text image component

 

Please let me know how to achieve it  through css or js. Once achieved what tools could be used to measure the accuracy of angle is it exactly 45* degrees or not and is it 100pixel or not??

 

Below is the text on text  image component required.

 

srinivas_chann1_0-1599825151130.png

 

 

Thanks

 

 

1 Accepted Solution
Theo_Pendle
Correct answer by
Community Advisor
Community Advisor

Hi @srinivas_chann1,

This forum is aimed at answering AEM-specific questions. This is generic CSS question which would probably be better asked on Stack Overflow.

Here is a thread that answers your question and uses the CSS skew() function to give you the exact 45° corner you're looking for: https://stackoverflow.com/questions/7324722/cut-corners-using-css/33122202#33122202 

Theo_Pendle_0-1599846481396.png

 

 

View solution in original post

2 Replies
Theo_Pendle
Correct answer by
Community Advisor
Community Advisor

Hi @srinivas_chann1,

This forum is aimed at answering AEM-specific questions. This is generic CSS question which would probably be better asked on Stack Overflow.

Here is a thread that answers your question and uses the CSS skew() function to give you the exact 45° corner you're looking for: https://stackoverflow.com/questions/7324722/cut-corners-using-css/33122202#33122202 

Theo_Pendle_0-1599846481396.png

 

 

View solution in original post