locked
to bring the view details button in the same row of other view details button contain in the same container RRS feed

  • Question

  • User-1355965324 posted

    Hi

    I have three <div class="col-md-4"> in a row.  Each column contain Heading , Content, view detail button. In column 3 , the content is one line more,  than that of  other column. So the view detail button is not coming the same row of other view details button in   the other column.  How can I bring the view details column in the same row , irrespective of the content Please help. Now when the content  paragraph getting bigger , the the button going down 

    I have given the image link here

    https://drive.google.com/open?id=18UuGqvzKYpDP5LUEFEl_f32kFAbyXYYU

    My code is as given below

     <!-- HOME ICON SECTION -->
        <section id="home-icons" class="py-5">
            <div class="container">
                <div class="row">
                    <div class="col-md-4">
                        <h2>Heading</h2>
                        <p>Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui.
                        </p>
                        <p><a class="btn btn-secondary" href="#" role="button">View details &raquo;</a></p>
                    </div>
                    <div class="col-md-4">
                        <h2>Heading</h2>
                        <p>Donec id elit non mi porta gravida at eget metus. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Etiam porta sem malesuada magna mollis euismod. Donec sed odio dui.
                        </p>
                        <p><a class="btn btn-secondary" href="#" role="button">View details &raquo;</a></p>
                    </div>
                    <div class="col-md-4">
                        <h2>Heading</h2>
                        <p>Donec sed odio dui. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Vestibulum id ligula porta felis euismod semper. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit
                            amet risus.</p>
                        <p><a class="btn btn-secondary" href="#" role="button">View details &raquo;</a></p>
                    </div>
                </div>
        </section>

    Please help

    Thursday, May 10, 2018 6:12 AM

All replies

  • User1394363656 posted

    If you familiar with jquery and ajax you can use it.

    for example :

     $("MyLick").click(function(){ 
             $.post("/MyDetailUrl",{Id:5},function(content){alert(content);});
    
    });

    it just an example, you can find lots of solutions.

    Thursday, May 10, 2018 6:41 AM
  • User-1355965324 posted

    I don't think your answer is related to my query. My question is related to the bootstrap  btn alignment problem when the content of the container is  small or large and to bring the btn in the same row.

    Thursday, May 10, 2018 8:28 AM
  • User1394363656 posted

    Sorry didn't help you. 

    Friday, May 11, 2018 8:58 AM
  • User36583972 posted


    Hi polachan,

    I have three <div class="col-md-4"> in a row.  Each column contain Heading , Content, view detail button. In column 3 , the content is one line more,  than that of  other column. So the view detail button is not coming the same row of other view details button in   the other column.  How can I bring the view details column in the same row , irrespective of the content Please help. Now when the content  paragraph getting bigger , the the button going down 

    To troubleshoot this issue, we really need the source code to reproduce the problem. You will get much better answers if you provide Minimal code demo(Use as little code as possible that still produces the same problem) people can use to reproduce the problem.

    Thank you for your understanding.

    Best Regards,

    Yong Lu

    Monday, May 14, 2018 9:37 AM