• 0

    Вопрос

    Добрый день друзья. Есть вопрос по поводу верстки, верстаю макет - и в блоке услуг не могу выравнить блоки с видами ремонта в одну линию, задал в hmtl класс, в css - задал отступы и display:inline-block,  и ничего не происходит. 

    div class="row">
                        <div class="col-md-12">
                            <div class="mc_wrap">
                            <div class="mc_item_wrap">
                                
                                <div class="mc_item">
                                    12345677
                                </div>
                                <div class="mc_item">
                                    12345677
                                </div>
                                <div class="mc_item">
                                    12345677
                                </div>
                                
                            </div>
                            </div>
                        </div>
                     </div>
    .mc_item_wrap {
        margin-left: 30px;
        width: 158px;
        display: inline-block;
    }

    Проблема  в этом <- Если есть надобность могу скинуть весь архив с проектом

    Изменено пользователем Владимир Горинов

    Поделиться сообщением


    Ссылка на сообщение
    Поделиться на других сайтах

    6 ответов на этот вопрос

    Рекомендуемые сообщения

    • 0
    npofopr

    display: inline-block; применяется к конкретному блоку. 

    вам нужно указать, видимо 

    .mc_item_wrap > .mc_item

     

    Поделиться сообщением


    Ссылка на сообщение
    Поделиться на других сайтах
    • 0
    npofopr

    А что по вашему должно произойти? 

    Весь проект не надо, достаточно фрагмент разместить в любой песочнице.

    Поделиться сообщением


    Ссылка на сообщение
    Поделиться на других сайтах
    • 0

    Как я думал что дивы которые находятся в контейнере должны из такого положения перейти в линейное, разве не это делает inline-block?

    Безымянный.png

    Поделиться сообщением


    Ссылка на сообщение
    Поделиться на других сайтах
    • 0

    Я думал что он автоматически приобретает свойство родителя...спасибо большое. все получилось^_^

    Поделиться сообщением


    Ссылка на сообщение
    Поделиться на других сайтах
    • 0
    npofopr

    У display: flex; да, у всего остального нет.

    Поделиться сообщением


    Ссылка на сообщение
    Поделиться на других сайтах
    • 0
    SelenIT

    На самом деле зависит от свойства. Бывают наследуемые свойства и ненаследуемые. Display — ненаследуемое.

    При display:flex и будущем (как минимум в Firefox 52+ и Chrome 57+) display:grid к непосредственным потомкам такого контейнера применяются особые правила, это да. Но само свойство не наследуется, так что если надо разместить флекс-контейнер во флекс-контейнере, внутреннему блоку всё равно тоже надо будет явно указать display:flex.

    Поделиться сообщением


    Ссылка на сообщение
    Поделиться на других сайтах

    Создайте аккаунт или войдите в него для комментирования

    Вы должны быть пользователем, чтобы оставить комментарий

    Создать аккаунт

    Зарегистрируйтесь для получения аккаунта. Это просто!

    Зарегистрировать аккаунт

    Войти

    Уже зарегистрированы? Войдите здесь.

    Войти сейчас

    • Войти через Facebook
    • Войти через Twitter
    • Войти через Microsoft
    • Войти через LinkedIn
    • Войти через Google

    • Похожие публикации

      • Tardpipl
        Автор: Tardpipl
        Вечер Добрый. Пишу с просьбой дабы объяснили как можно перенести блок в определенно место.
         

      • Tardpipl
        Автор: Tardpipl
        Вечер добрый. Не могу решить проблему с блоками. Бывает то что div блок залезает на другой при сжатие страницы. Как избавится от смещения блоков при сжатие? Как не дать блоку div залезть на другой блок?
      • Rinat
        Автор: Rinat
        <!--Таблица на диве-->
        <div class="table">
                <div class="row">
                    <div class="cell cell-1">1</div>
                    <div class="cell cell-2">2</div>
                </div>
                <div class="row row-2">
                    <div class="cell cell-3" rowspan="2">3</div>
                    <div class="cell cell-4">4</div>
                </div>
            </div>
        /*——css реализация—————*/
        .table{display: table; border: 1px solid silver; padding: 10px;}
        .row{display: table-row; border: 1px solid silver; padding: 10px;}
        .cell{display: table-cell; border: 1px solid silver; padding: 10px;}
        подскажите как склеить ячейку 3 и 4? Спасибо всем за помощь!
    • advertisement_alt
    • advertisement_alt
    • advertisement_alt