CODEWITHSUNDEEP
javascriptjqueryhtmlcsstwitter-bootstrap
dimitrisd
dimitrisd

Reputation: 652

Bootstrap Datetimepicker span breaks

I use Bootstrap 3 Datepicker v4 but something breaks and I cannot fix it. I think it's the input which break the css. 

<div class="container">
    <div class="row">
        <div class='col-sm-6'>
            <div class="form-group">
                <div class='input-group date' id='datetimepicker1'>
                    <input type='text' class="form-control" />
                    <span class="input-group-addon">
                        <span class="glyphicon glyphicon-calendar"></span>
                    </span>
                </div>
            </div>
        </div>
        <script type="text/javascript">
            $(function () {
                $('#datetimepicker1').datetimepicker();
            });
        </script>
    </div>
</div>

RESULT

What should I overwrite, in order to remove the margin between the span and the input?

enter image description here

Upvotes: 0

Views: 514

Answers (1)

Grizzly
Grizzly

Reputation: 5953

I tried to recreate the issue using Bootply, but was unable to.

So try changing the width of the div, like so:

<div class='input-group date' id='datetimepicker1' style="width: 90%" <!-- Or something like that depending on what your preference is -->>
    <input type='text' class="form-control" />
        <span class="input-group-addon">
            <span class="glyphicon glyphicon-calendar"></span>
        </span>
</div>

Let me know if this helps!

Upvotes: 1

Related Questions