Example A, if written in plain css would look like this
.parent{// Parent Mobile Styles}.parent.child{// Child Mobile Styles}@includebreakpoint(desktop){// actual css code for this breakpoint.parent{// Parent Mobile Styles}.parent.child{// Child Mobile Styles}}
The advantage scss has over css is, you can compose nested styles without having to write the parent class selector (or the same class selector) multiple times (concise and readable code). In that context, Example B is a better way to write as your code as you write your class selector only once and all the relevant style definitions are composed into it at one place (styles and breakpoint specific styles).
Example B
.parent{// all parent style definitions are contained in one place// Parent Mobile Styles@includebreakpoint(desktop){// Parent Desktop Styles }.child{// all child style definitions are contained in one place@includebreakpoint(desktop){// Parent Desktop Styles}}}
For further actions, you may consider blocking this person and/or reporting abuse
We're a place where coders share, stay up-to-date and grow their careers.
I'd prefer to take advantage of scss nesting.
Example A, if written in plain
csswould look like thisThe advantage
scsshas over css is, you can compose nested styles without having to write theparentclass selector (or the same class selector) multiple times (concise and readable code). In that context, Example B is a better way to write as your code as you write your class selector only once and all the relevant style definitions are composed into it at one place (styles and breakpoint specific styles).Example B