4

I've just noticed myself using both border: none and border: 0 to reset a border in the cascade.

Is there a One True Way™ to reset a border that has already been set?

BoltClock
  • 700,868
  • 160
  • 1,392
  • 1,356
alex
  • 479,566
  • 201
  • 878
  • 984

3 Answers3

1

As you should probably be aware, border is a shorthand property. What you may not realize (and, in fact, is new to me too) is that those values do not pertain to the shorthand property itself but each belongs to one of the longhand CSS border properties (technically, these are shorthands for all sides as well but I won't get to that):

  • none is a value for border-style
  • 0 is a value for border-width

As an additional note, each of these values is the initial value of its respective longhand property. In other words, the declarations border: none and border: 0 are functionally equivalent — setting border: none will also set border-width to 0, and setting border: 0 will also set border-style to none.

So there is no "right" way to declare the lack of a border using the border shorthand. Use whichever makes more sense to you.

BoltClock
  • 700,868
  • 160
  • 1,392
  • 1,356
  • Well I was wondering if any which one was the right way... thought I may as well be doing it right instead of relying on a browser quirk (if any). – alex Jun 24 '10 at 05:41
1

Completely up to you, some say one way, some say the other. The border: none is the 'technical' way to do it because 'none' is a listed allowed value for border, but border: 0 is just basically a short-hand version to save a few extra characters. I don't even know which one I use, it doesn't really bother me either way.

Edit: Here's another good conversation on a similar topic (0 vs 0em)...
CSS difference between 0 and 0em

Community
  • 1
  • 1
animuson
  • 53,861
  • 28
  • 137
  • 147
-1

technically, it should be border: 0 <-- if you are using the short hand,

OR border-style:none; <-- I prefer this, but if a few char matters...

The shorthand is border: [width] [style] [color];

http://www.w3schools.com/css/css_border.asp (or the formal specification: http://www.w3.org/TR/CSS2/box.html#border-properties)

Note: As pointed out by below comment. border: 0px; is redundant but border: 1px; is not. Units (em, ex, px, etc) are not optional when value > 0.

Kasumi
  • 911
  • 5
  • 15