Top
Home > Code Snippets > Hawkee's Snippets > CSS

All CSS Border Styles


CSS Code
+ 0 likes
Please Register to submit score.
Bookmark and Share
Average Score  0.0 (of 0 scores)
Date Added  Mar 23, 2007
Last Updated  Aug 13, 2009
Tags  border  css  styles 

Introduction

I always need these for my CSS development. They're great for making your CSS more visible for debugging. You can include one or all in your main stylesheet and just apply the style to any div you're working on:

Code:
<div class='solid'>Content</div>


Grab the Code

.solid { border: 1px solid #000000; }
.dashed { border: 1px dashed #000000; }
.double { border: 1px double #000000; }
.dotted { border: 1px dotted #000000; }
.groove { border: 1px groove #000000; }
.inset { border: 1px inset #000000; }
.outset { border: 1px outset #000000; }
.ridge { border: 1px ridge #000000; }

Comments

  (7)  RSS
Noutrious
Comments: 365
 
CSS Snippet:  All CSS Border Styles
Posted on Mar 25, 2007 2:54 pm
btw, you can change the 1px to 2px etc., to get bigger border.
Hawkee
Comments: 1,039
 
CSS Snippet:  All CSS Border Styles
Posted on Mar 25, 2007 3:55 pm
Of course, but I mostly use this for debugging CSS code.
vaseline28
Comments: 162
 
CSS Snippet:  All CSS Border Styles
Posted on Jun 21, 2008 3:54 am
And obviously you can change #000000 to whichever color you would like!
Hawkee
Comments: 1,039
 
CSS Snippet:  All CSS Border Styles
Posted on Jun 23, 2008 5:14 pm
Yeah, or just use #000 as I've been doing lately.
FireFly
Comments: 4
 
CSS Snippet:  All CSS Border Styles
Posted on Sep 11, 2008 8:21 am
Of course it's useful for cross-browser testing, but when I'm struggling with the CSS, I usually use the Web developers' toolbar, an addon for FireFox.
(Though I use Opera for my general browsing and website testing.)
Korvin
Comments: 336
 
CSS Snippet:  All CSS Border Styles
Posted on Aug 13, 2009 10:08 pm
<div style='solid'>Content</div>
wouldnt that be:
<div class='solid'>Content</div>
Hawkee
Comments: 1,039
 
CSS Snippet:  All CSS Border Styles
Posted on Aug 13, 2009 11:49 pm
Thanks Korvin, was a slight oversight.

Commenting Options

Register or Login to Hawkee.com or use your Facebook or Twitter account by clicking the corresponding button below.

  
Bottom