Выравнивание дочернего Div в родительском div [дубликат]

На этот вопрос уже есть ответы здесь :

Закрыто 8 лет назад .

Возможный дубликат:
Сделать внешний div автоматически той же высоты, что и его плавающее содержимое

Я чувствую, что мне не хватает чего-то очень простого ...

У нас есть простая настройка: родительский div который содержит дочерний div. Я хочу:

заставить родительский элемент изменить его высоту на основе дочернего
выровнять дочерний элемент по правому краю родительского элемента вместо левого по умолчанию.

Использование float: right приведет к тому, что родительский элемент больше не будет правильно изменять размер и дочерний элемент будет «выпрыгивать» из родительского элемента.

Я пробовал использовать align: right и text-align: right , но пока без кубиков.

HTML:

     parent
         child
 

         child2

CSS:

    div{ padding: 15px; margin: 5px; }
    p{ padding: 0; margin: 0; }

    #parent{
        background-color: orange;
        width: 500px;
    }

    .child{
        background-color: grey;
        height: 200px;
        width: 100px;
    }

    .right{ float: right; } // note: as the commenters suggested I should also be using a float:left on the other child.

Чего я хочу :

what I want

Любые предложения о том, что я могу изменить с помощью #parent или .right , чтобы правильно выровнять child2 по правому краю?

РЕДАКТИРОВАТЬ

Лучшее исправление, которое я нашел для этого, - просто использовать display: table на родитель. Хотя я не тестировал это в IE, он решает проблему в браузерах, которые мне нравятся, и позволяет избежать использования неинтуитивного метода overflow: hidden , обсуждаемого в комментариях.

Еще лучше: установите для margin-left дочернего элемента значение auto.

задан Community 23 May 2017 в 10:30

0 ответов

Другие вопросы по тегам:

css html parent alignment

Выравнивание дочернего Div в родительском div [дубликат]

0 ответов

Похожие вопросы: