Unpredicted CSS generated about gulp-ruby-sass

[UltCombo]

That's how Sass works—@extend works globally across all selectors that will be part of your output file.

The good practice is usually to extend a placeholder selector that is only used in the given file. E.g.:

%input, input {
  // ...
}

select {
  @extend %input;
}

Maybe use classes instead of tag names, if you don't intend to apply the styling to all elements with the same name your application.

That said, Stack Overflow is a more suited place to ask technical questions.

[thovo]

@UltCombo thank for your answer, because I just have 2 inputs and 2 selects there so I don't want to think about naming, that's why I used only tag names (I'll change now)

You are right that I should ask inside StackOverflow than here, it is just because I was typing the issue and just found that @extend in the same time so I asked here.

in my scss file, I let select extend only the input but later it extended also input[type="checkbox"], is it correct with sass?

[UltCombo]

Yep, the @extend behavior is working as designed, but I agree it is rather non-intuitive quite often. The behavior is documented as follows:

@extend works by inserting the extending selector […] anywhere in the stylesheet that the extended selector […] appears.

So @extend works on partial and even nested selectors.
See also: What Nobody Told You About Sass’s @extend

[thovo]

Many thanks, it is clear now!