jeewan
jeewan

Reputation: 1605

How to make cut off in CSS as shown in the attached image?

How can I make this style with the help of CSS3? I know how to do the rounded corners but I need to design a small cut off as show in the attached image here too. How can I make this?

like this

Upvotes: 0

Views: 68

Answers (1)

OctoD
OctoD

Reputation: 361

If I didn't misunderstood ... it's just an easy example.

an example: http://jsfiddle.net/JJ8ZB/7/

.cnt{ 
    background-image: url('myimage');
    background-repeat:none;
    background-color:#xxxxxx;
}

.ff, .ss{
    border-radius:x px;

}
.ff{
    border-bottom-right-radius: 0px;
}
.ss{
    border-top-right-radius: 0px;
    height:x px;
}​

<div class="cnt">
    <div class="ff">Latest news....</div>
    <div class="ss">Click here...</div>
</div>

Upvotes: 1

Related Questions