jernaumorat
jernaumorat

Reputation: 230

Border 0px broken line

EDIT: jsfiddle

I'm trying to have a top and left border with rounded edges, yet my code gives me a broken line on the bottom and right sides, as shown in the picture below. Setting border-right-width or border-bottom-width to 0px has no effect. At present I am only testing this on Chrome.

CSS as follows:

border-top:10px solid #CC99CC;
border-left:5px solid #CC99CC;
border-top-left-radius:10px;
border-top-right-radius:5px;
border-bottom-left-radius:10px;

enter image description here

Upvotes: 0

Views: 267

Answers (1)

Sunny
Sunny

Reputation: 2332

Apply your border styles to the #wrapper instead:

body { 
    background-color: #000;
}

#wrapper {
    border-top:10px solid #CC99CC;
    border-left:5px solid #CC99CC;
    border-top-left-radius:10px;
    border-top-right-radius:5px;
    border-bottom-left-radius:10px;
}

http://jsfiddle.net/rezv2/2/

Upvotes: 1

Related Questions