CSS: выравнивание div 2 на строке без использования float [duplicate]

Question

CSS: выравнивание div 2 на строке без использования float [duplicate]

Вы можете создать свой собственный абстрактный класс, который реализует ChildEventListener, но не обеспечивает реализацию onChildAdded:

abstract class ChildAddedEventListener : ChildEventListener {
    override fun onCancelled(p0: DatabaseError) {
    }

    override fun onChildMoved(p0: DataSnapshot, p1: String?) {
    }

    override fun onChildChanged(p0: DataSnapshot, p1: String?) {
    }

    override fun onChildRemoved(p0: DataSnapshot) {
    }
}

Затем вы подклассифицируете ChildAddedEventListener и предоставляете только нужную реализацию:

class MyChildAddedEventListener: ChildAddedEventListener {
    override fun onChildAdded(p0: DataSnapshot, p1: String?) {
        // your code here
    }
}

При этом вы можете использовать его как выражение встроенного объекта при добавлении его в запрос:

query.addChildEventListener(object : ChildAddedEventListener() {
    override fun onChildAdded(p0: DataSnapshot, p1: String?) {
        subscriber.onNext(Value.parse(unitName, varName, p0))
    }
})

-1

css

задан Toby 18 January 2019 в 21:38

4 ответа

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

css

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

score 0 · Answer 1

Вы должны использовать flexbox.

вам нужно будет обернуть ваши div в другую ширину div the class = "container"

, тогда вы можете сделать это

   .container {
      display: flex;           /* display side by side */
      align-items: center;     /* align vertically */
    }
    .container > * {
      flex: 1; 
    }

score 0 · Answer 2

display: inline; и display: inline-block используют межстрочный интервал в отличие от display: block, который будет позиционировать элементы более точно.

Перемещая элементы div в одну строку, это заставляет элементы div иметь нулевое пространство между ними.

См. эту статью для получения дополнительной информации.

body {
    margin: 0px;
    padding: 0px;
}
div {
    min-height: 50vh;
    width: 50%;
    display: inline-block;
}
div:nth-child(1) {
    background-color: red;
}
div:nth-child(2) {
    background-color: green;
}
div:nth-child(3) {
    background-color: blue;
}
div:nth-child(4) {
    background-color: yellow;
}

<div>Red</div><div>Green</div><div>Blue</div><div>Yellow</div>

score 0 · Answer 3

Если вам нужно использовать встроенный блок, убедитесь, что вы пишете HTML без пробелов.

это не работает:

<div>Red</div>
<div>Green</div>
<div>Blue</div>
<div>Yellow</div>

это работает:

<div>Red</div><div>Green</div><div>Blue</div><div>Yellow</div>

score 0 · Answer 4

Поскольку inline-block учитывает пробел, в этом случае каждый элемент помещает пробел между символами. Избегайте этого, есть некоторые приемы , но я предлагаю вам использовать css grid:

body {
 display: grid;
 grid-template-columns: 1fr 1fr;
}