custom-select inside a input-group-sm does not render as custom-select-sm

[tiesont]

Operating system and version

Windows 10 Pro

Browser and version

Chrome 70.0.3538.110 (64bit), Firefox 63.0.3 (64bit), IE11, MS Edge

Code to reproduce

Bootply (using 4.1.3):

https://www.bootply.com/iOZaCYxDfA

Code:

<div class="input-group input-group-sm">
  <div class="input-group-prepend">
    <div class="input-group-text">Label here</div>
  </div>
  <select class="custom-select">
    <option value="1">Option 1</option>
    <option value="2">Option 2</option>
    <option value="3">Option 3</option>
  </select>
</div>

From the input-group documentation, I was assuming my custom-select would automatically render the same as a small custom select if I added the input-group-sm class. It does not appear to be the case. Is this intentional?

[herbalite]

Add form-control, as it is shown in the example page you are referring to and things should be fine

  <select class="custom-select form-control">

[tiesont]

@herbalite That changes how the custom select renders, and really shouldn't be necessary. I get the sizing I was looking for by adding custom-select-sm, but the point is that the docs don't reflect what (I assume) was intended to happen.

[alecpl]

Probably fixed by: #27677

[mdo]

Closing per last comment.