Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

CSS Brace Styles

I'm unable to figure how the standard (or just popular) brace style names apply to CSS. Here're all the brace styles:

/* one - pico? */
selector { property: value; 
           property: value; }

/* two - pico extra */
selector { 
    property: value; /* Start Properties on Newline */
    property: value; }

/* three - horstmann? */
selector 
{ property: value;
  property: value;
}

/* four - GNU? */
selector 
{ 
    property: value; /* Start Properties on Newline */
    property: value;
}​

/* five - GNU Saver */
selector { property: value;
           property: value;
}

/* six - CSS Default */
selector { 
    property: value; /* Start Properties on Newline */
    property: value;
}

/* seven - Braces Aligned */
selector { property: value;
           property: value;
         }

/* eight - Banner? */
selector {
    property: value; /* Start Properties on Newline */
    property: value;
    }

Can someone please name each brace style for me?

Many thanks!

like image 568
eozzy Avatar asked May 30 '10 10:05

eozzy


People also ask

What brackets are used in CSS?

Be sure to save the CSS file with your HTML files! The syntax in CSS is different than what it is in HTML. HTML uses arrows, while CSS uses curly brackets and semi-colons are used at the end of each line.

Can we use curly braces in CSS?

Important: BracesAll CSS rulesets must have opening and closing curly braces: .

What is brace style?

Brace style is closely related to indent style in programming and describes the placement of braces relative to their control statement and body. There are probably a dozen, if not more, brace styles in the world.


2 Answers

I would say three is Horstmann.

Pico as it is, but the opening brace starts on a newline.

Banner would be:

selector {
    property: value;
    property: value;
    }

The rest of your guesses seem correct.

I took most of these from Indent style on Wikipedia :)

like image 120
TheDeadMedic Avatar answered Oct 02 '22 12:10

TheDeadMedic


I think you named the most popular indent styles yourself. I personally, prefer:

.class {
  property: value;
}
like image 39
Ivy Evans Avatar answered Oct 02 '22 13:10

Ivy Evans