Почему bootstrap неправильно выравнивает ячейки?

Question

Я пытаюсь использовать Bootstrap, и у меня возникла проблема, связанная с тем, что в среднем разрешении два столбца, которые должны располагаться рядом, отображаются друг под другом, см. Скриншот http://dynanetics.com/problem-screenshot.png, код на http://dynanetics.com

При более высоком разрешении (большом и большом) это работает правильно. Почему это происходит в среднем разрешении?

Любая помощь будет оценена, спасибо.

Соответствующий код ниже:

        <div class="container">
            <div class="row">
                <div class="col-md-4">                      

                    <div class="row">
                        <div class="col-md-3 d-block float-left">
                            <img src="logo-sitesmall.png" class="d-block float-none">                              
                        </div>
                        <div class="col-md-6 d-block float-left text-center">
                            <h1 class="brandname">Test site name</h1>                              
                        </div>
                    </div>
                </div>
                <div class="col-md-4">                      
</div>
            </div>
        </div>

Answer 1

Я думаю, что ваш div = "col-md-4", после того, как первая строка div слишком мала, чтобы оба контента были в одной строке в среднем разрешении, попробуйте увеличить его.