search

suitcss / base

CSS base styles for web apps (a thin layer on top of normalize.css)
http://suitcss.github.io/base/test/
MIT License
193 stars 24 forks source link

Redundant box-sizing content #30

Closed oleersoy closed 8 years ago

oleersoy commented 8 years ago

Bootstrap 4's box-sizing inheritance block looks like this:

*,
*::before,
*::after {
  box-sizing: inherit;
}

The one in base includes an addition input element. I believe that the * selects that element.

giuseppeg commented 8 years ago

It was added because of https://github.com/suitcss/base/pull/29

oleersoy commented 8 years ago

Read up on it some more. Itt may be wise to separate it out. Bootstrap does it like this:

input[type="search"] {
  // Undo Normalize's default here to match our global overrides.
  box-sizing: inherit;
  // This overrides the extra rounded corners on search inputs in iOS so that our
  // `.form-control` class can properly style them. Note that this cannot simply
  // be added to `.form-control` as it's not specific enough. For details, see
  // https://github.com/twbs/bootstrap/issues/11586.
  -webkit-appearance: none;
}
simonsmith commented 8 years ago

Although it's in a different ruleset the code is effectively the same. I believe the reason is because they already had some styles applied to input[type=search] so it makes sense for their files to have that layout. See - https://github.com/twbs/bootstrap/commit/468a9d9359a1008675b2c19a1fae1d9016a7686d

oleersoy commented 8 years ago

K - Just FYI I opened a request with Normalize.css to adopt border-box instead of content box: https://github.com/necolas/normalize.css/issues/486