bootstrap nested column not working

Question

I have a container with nested columns. But now the columns are listed one by one below.

I have fiddled the problem.

Just have a look.

I want to display the Amazon icon and the text under the icon in the same line. How to achieve that. I have tried a lot but no result. Somebody, please help me. Thankyou.

For making nested column, you should wrap inside a row. For eg: container --> Column --> Row --> Column --> Row --> Column — Shiladitya
– Shiladitya, Commented Jun 30, 2017 at 7:55

Shiladitya · Accepted Answer · 2017-06-30 08:06:17Z

1

Check this fiddle if you are looking something like this. https://jsfiddle.net/xrhprup8/1/

<div class="col-xs-12 col-sm-12 col-md-4 col-lg-4 full">
            <div class="row">
                <div class="col-xs-12 col-sm-12 col-md-12 col-lg-12 full">
                    <div class="single-box-flipkart">
                        <div class="row">
                            <div class="col-lg-4 col-md-4 col-sm-12 col-xs-12">
                                <h1><i class="fa fa-amazon fa-2x"></i></h1>
                            </div>
                            <div class="col-lg-8 col-md-8 col-sm-12 col-xs-12">
                                <h4>Lorem Ipsum is simply.</h4>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
 </div>

answered Jun 30, 2017 at 8:06

Shiladitya

12.2k17 gold badges29 silver badges43 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

bootstrap nested column not working

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related