Posted paper css3

0 votes

I'm attempting to make a posted paper in pure CSS3 that has box-shadow and transitions. I've so far completed a paper with shadows on both sides, but I want to change the appearance to something like this:enter image description here

Is that even possible without images?

.shadow {
  width: 150px;
  height: 150px;
  background-color: yellow;
  position: relative;
}
.shadow:after {
  position: absolute;
  right: 10px;
  left: auto;
  -webkit-transform: skew(8deg) rotate(3deg);
  -moz-transform: skew(8deg) rotate(3deg);
  -ms-transform: skew(8deg) rotate(3deg);
  -o-transform: skew(8deg) rotate(3deg);
  transform: skew(8deg) rotate(3deg);
}
<div class="shadow">
  edit this even further
</div>
Aug 22 in CSS by Edureka
• 11,040 points
18 views

No answer to this question. Be the first to respond.

Your answer

Your name to display (optional):
Privacy: Your email address will only be used for sending these notifications.

Related Questions In CSS

0 votes
1 answer

CSS to set A4 paper size

I looked into it further, and the ...READ MORE

answered Jun 21 in CSS by Edureka
• 9,540 points
878 views
0 votes
0 answers

Looping Animation of text color change using CSS3

I have text that I want to ...READ MORE

Jun 22 in CSS by Edureka
• 11,040 points
66 views
0 votes
0 answers

CSS3 Rotate Animation

<img class="image" src="" alt="" width="120" height="120"> Cannot get ...READ MORE

Jun 22 in CSS by Edureka
• 11,040 points
51 views
0 votes
0 answers

background-size in shorthand background property (CSS3)

I'm trying to mix background-image and background-size properties in a shorthanded background property. ...READ MORE

Jul 6 in CSS by Edureka
• 11,040 points
15 views
0 votes
0 answers

CSS3 selector :first-of-type with class name?

Is it possible to choose the first ...READ MORE

Aug 17 in CSS by Edureka
• 11,040 points
19 views
0 votes
0 answers

css3 drop shadow under another div, z-index not working

To make it appear as though one ...READ MORE

Aug 18 in CSS by Edureka
• 11,040 points
12 views
0 votes
1 answer

How to build a special polygon (a kite shape) with HTML & CSS only?

I made two divs, one for Arc ...READ MORE

answered May 28 in CSS by Edureka
• 9,540 points
169 views
0 votes
1 answer

html/css hexagon with image inside

The CSS3 clip-path feature is a novel ...READ MORE

answered Jun 10 in CSS by Edureka
• 9,540 points
320 views
0 votes
0 answers

How can I create a round arrow with only HTML and CSS?

Using CSS and HTML, I'm attempting to ...READ MORE

Jul 8 in CSS by Edureka
• 11,040 points
46 views
0 votes
0 answers

how to draw a rectangle in HTML or CSS?

I am trying to draw a rectangle ...READ MORE

Aug 18 in CSS by Edureka
• 11,040 points
58 views
webinar REGISTER FOR FREE WEBINAR X
Send OTP
REGISTER NOW
webinar_success Thank you for registering Join Edureka Meetup community for 100+ Free Webinars each month JOIN MEETUP GROUP