How to align div elements of innerDiv in one line

Question

<script type="text/javascript">
        $(document).ready(function () {
            var iCnt = 0;

creating div element

            var container = $(document.createElement('div')).css({
               ---some css--
            });

task showing status

            var status = { 0: "completed", 1: "completed", 2: "Running",                 3:"Pending", 4: "Pending" };
           var cssClass = '';

            iCnt = iCnt + 1;
            var i = 0;

            $.each(status, function (idx, i) { 

                                 }


                var innerDiv = $(document.createElement('div')).css({
                   -- some css---
                });

                $(container).append(innerDiv);

Now how to align these div elements of innerDiv one after the another in one line

            });

            $('#main').after(container);
        });
    </script>

Answer 1

This user's problem was solved by advice via comment

Try adding float:left in css property for each div and provide enough width to outer div