RE: % is not a valid unit for border-width

Does calc in border-width help?

From: Matthew Wilcox [mailto:elvendil@gmail.com]
Sent: Friday, January 20, 2012 5:13 AM
To: L. David Baron
Cc: Lea Verou; www-style@w3.org
Subject: Re: % is not a valid unit for border-width

A recent article on "the bane of responsive layouts" - a lack of % for border-width: http://designshack.net/articles/css/beating-borders-the-bane-of-responsive-layout/


The solutions are poor - either you use outline and get errors with Firefox (and poor line placement) or you use box-sizing, but box-sizing can't degrade gracefully.

We could do with % for border-width.

This inability to gracefully degrade is also why I'd like to see conditionals. When you change box-model you have to change other values - but those values have no idea which box-model they're working inside of.


On 6 January 2012 10:10, Matthew Wilcox <elvendil@gmail.com<mailto:elvendil@gmail.com>> wrote:
Sorry Tab, typo in the url, I did indeed mean http://adaptive-images.com


I'm glad that's convinced you :)

@ David

I can see why that's an issue for you. I would put forward that when
%units are used the priority changes - it's no longer about ensuring
the border is precisely rounded to give an even look, but about
accuracy of layout. I'd also agree that it would make sense for CSS to
specify how that's handled.

To be clear though, this is a technique that is already in us,
becoming mainstream, and will be used more and more given how mobile
devices are set to outstrip desktop by 2015 (and it is in that context
where it matters most, at the moment). Because it is used for layout
it is vital that it is 'fixed'.

Additionally, with higher resolution devices becoming increasingly
popular (like retina displays) the problem of "uneven" borders will
become less and less noticeable. It's only an artefact of having a
limited number of pixels on the display, and that's becoming less of a
limit as time wears on. Thinking of the future, I'd like to suggest we
downplay the limitations of current displays and go with sacrificing
border width consistency around the box instead of some other option.