Why is my column not offsetting in bootstrap 4?

Question

I am new to bootsrap 4. (I am coming from bootsrap 3). When I try offsetting the column it doesn't do anything, no matter what offset number I choose, it doesn't do anything.

Below is my code and also a link to my jsfiddle.

Any help would be really appreciated.

https://jsfiddle.net/eldan88/Lgeadvyk/#&togetherjs=ERumPnkeo9

<div class="container">

    <div class="row">
        <div class="col-md-8 offset-md-2 ">
            <input type="text" name="test" class="form-control" value="test">

        </div>

    </div>

</div>

Answer 1

Offsetting has a new behavior in bootstrap 4, see https://getbootstrap.com/docs/4.0/layout/grid/#offsetting-columns

quote:

With the move to flexbox in v4, we no longer have v3’s style of offset classes. Instead, use margin utilities like .mr-auto to force sibling columns away from one another.