Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

CSS3 Rounded and Dotted borders?

Tags:

Is it possible to create a border in CSS3 such that they are rounded and dotted?

I'm rounding my corners but they appear solid with:

border: 1px dotted gray;
-moz-border-radius-topright: 30px 20px;
-moz-border-radius-topleft: 30px 20px;

The rest of the border is dotted but the corners are solid.

I understand that this is specific to Firefox but that's fine for now.

Thanks

like image 319
jmcmahon Avatar asked Sep 15 '10 13:09

jmcmahon


People also ask

Which CSS property is used for an image border with dotted red?

The border-style property specifies what kind of border to display. The following values are allowed: dotted - Defines a dotted border.

How do I change the space between dotted border dots?

The task is to increase space between the dotted border dots. you can just adjust the size with the background-size property, the proportion with the background-image property, and the proportion with the linear-gradient percentages. So, you can have several dotted borders using multiple backgrounds.


1 Answers

It'a bug in firefox.see this issue,mozilla doesn't support rounded corner for dotted and dashed border.

like image 171
Srinivas Reddy Thatiparthy Avatar answered Sep 20 '22 19:09

Srinivas Reddy Thatiparthy