W3C home > Mailing lists > Public > public-css-archive@w3.org > December 2019

Re: [csswg-drafts] [css-values] Add round()/floor()/ceil() functions (#2513)

From: Amelia Bellamy-Royds via GitHub <sysbot+gh@w3.org>
Date: Sat, 14 Dec 2019 17:31:49 +0000
To: public-css-archive@w3.org
Message-ID: <issue_comment.created-565736728-1576344708-sysbot+gh@w3.org>
When [Tab asked for opinions on Twitter](https://twitter.com/tabatkins/status/1205548021502464000), my first instinct was to favour separate round/ceil/floor rather than the more verbose function+keyword modifier option. And ceil and floor are familiar from JS.

But for people who don't have an imperative programming or mathematical background, maybe they are just more confusing jargon?

If the preference is to have a single function that does all three operations, I'd recommend (a) putting the keyword in front, and (b) using the keywords from CSS Rhythm, so it's more readable as an English phrase: "round up", "round down", "round nearest" (which would still be the default for round):

```
round() = round([[up|down|nearest|towards-zero|away-from-zero],]? <value>, <step-size>)
```

(The `towards-zero` and `away-from-zero` being different from `up` and `down` in how they affect negative versus positive values. Which is an option ceil and floor don't let you control.)

Another thought: it might be useful to have a third value for specifying an offset/initial value from which to start the step function. For example:

```css
round(var(--count), 2); /* rounds to the nearest even number */
round(var(--count), 2, 1); /* rounds to the nearest odd number */

/* or imagine setting the width of a grid container to neatly fit the child items… */
round(down, 100%, /* take 100% width and round it down */
  var(--item-width) + var(--gap-width), /* to a multiple of the total width for an item + gap */
  -1 * var(--gap-width) ); /* except that the first item doesn't need a gap, so subtract it */

``` 

-- 
GitHub Notification of comment by AmeliaBR
Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/2513#issuecomment-565736728 using your GitHub account
Received on Saturday, 14 December 2019 17:31:51 UTC

This archive was generated by hypermail 2.4.0 : Tuesday, 19 October 2021 01:31:18 UTC