- From: Praveen Puglia <praveenpuglia@gmail.com>
- Date: Wed, 8 Jun 2016 14:47:09 +0530
- To: www-style list <www-style@w3.org>
- Message-ID: <CANfatsqfkxEz6V05nbt7BjUt=gMQi-aQ_puWcXkeETVTZFKBng@mail.gmail.com>
Currently, when we create a dotted or dashed border, the only things we can modify are the width of the border and the color of it. There is no way we can control what the distance should be between dots or dashes. It all depends on the browser vendors and how they render them. It is, however, often necessary to tweak those to get a better suited borders. Example: 1. Varied distances between dashes/dots Instead of a border like this... - - - - - - - - - - - - - - - - - a border like this... - - - - - - - - - - - - or - - - - - - - - 2. Circular dots for dotted borders. Way to create ●●●●●●●●●●●●●●●●●●●●● Instead of just this... ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ ■ Right now, the only way to accomplish these is to use border-image which isn't really flexible for changing things on the fly. Each style would need a new image to be made. Otherwise use gradients to emulate these which doesn't take part into box-model calculations as border does. How about introducing new properties/values to address these? For example *border-separation : *which could take a *<length> *value and adjust the distance between two dashes/dots. A new border-style value:* dotted-round* or *dotted-circle* or a better name ? This is probably my first proposal of some sort so please advice me if I need to include more details or format the emails in a different way. -- Cheers! Praveen ◉ praveenpuglia.com ◉ @praveenpuglia <https://twitter.com/praveenpuglia>
Received on Wednesday, 8 June 2016 09:17:56 UTC