ReactJS: Как я могу выровнять , и формы в строке внутри ? ⇐ CSS Разбираемся в CSS Ответить Поиск Расширенный поиск

[Anonymous]

У меня есть и внутри контейнера. Как я могу заставить их выровняться в одном ряду, рядом друг с другом и в середине контейнера по вертикали?

Вот что у меня пока есть: < /p>




Верхняя черная часть — это панель навигации, и я хочу бок о бок выровняйте их в ряд рядом друг с другом слева направо и выровняйте вертикально по середине панели навигации:

ПОЖАЛУЙСТА, ПРОСМОТРИТЕ ИЗМЕНЕНИЕ ВНИЗУ ДЛЯ ОБНОВЛЕННОГО КОДА

import { Field, reduxForm } from 'redux-form';

const form = reduxForm({
form: 'register'
});

...




TESTING




Register







И таблица стилей CSS:

#wrapper {
width: 100%;
margin: 0 auto;
}

.container {
display: flex;
justify-content: center;
}

header {
width: 100%;
height: 85px;
overflow: hidden;
position: fixed;
top: 0;
left: 0;
z-index: 999;
background-color: black;
}
header h1#logo {
display: inline-block;
height: 85px;
line-height: 85px;
float: left;
font-size: 25px;
color: purple;
font-weight: 500;
}

#input-field {
background-color: rgba(255,255,255,0.1);
border-radius: 5px;
width: 150px;
height: 40px;
padding: 5px;
}


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

Решено убрать форму, но CSS останется прежним. Как я могу гибко выровнять следующее, чтобы добиться того, что я изначально хотел (Хотелось бы, чтобы h1 находился слева, а текстовое поле + кнопка справа?





TESTING



Register






Подробнее здесь: https://stackoverflow.com/questions/394 ... in-a-row-i