Как отобразить двух детей в одном ряду и третьего ребенка во втором ряду - PullRequest
Новая
       1

Как отобразить двух детей в одном ряду и третьего ребенка во втором ряду

1 голос
/ 25 марта 2019

Я пытаюсь отобразить идентификатор пользователя и флажок в верхней строке и текстовое поле во 2-й строке с помощью flex Я не могу этого сделать, поэтому любая помощь очень ценится.

Вот что я получаю:

My display

<body>        
  <div style="display:flex; flex-direction:row; width:100%;">
       <div>User ID</div>
       <img style="margin-right:3px; align-self:center;" src="correct.png" /> 
       <div><input type="text" name="fname"></div> 
  </div>      
</body>

Вот что я хочу:

What I want

Ответы [ 2 ]

2 голосов
/ 25 марта 2019

Изменить HTML (переместить закрытие </div> из flex после <img>) 

<div style="display:flex;">
       <div>User ID</div>
       <img style="margin-right:3px; align-self:center;" src="correct.png" /> 
</div>  
<div><input type="text" name="fname"></div>
2 голосов
/ 25 марта 2019

Я положил user id и img в 1 div и сделал это flex

<body>
  <div>
    <div style="display:flex; width:100%;">
      <div>User ID</div>
      <img style="margin-right:3px; align-self:center;" src="correct.png" />
    </div>
    <div><input type="text" name="fname"></div>
  </div>
</body>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...