Я пытаюсь использовать поплавки для позиционирования текста, но он даже не движется - PullRequest
Новая
       26

Я пытаюсь использовать поплавки для позиционирования текста, но он даже не движется

0 голосов
/ 26 февраля 2020

Я пытаюсь переместить «Краткое резюме Эрика Спайкманна» вместе с

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

1 Ответ

2 голосов
/ 26 февраля 2020

Используйте Flexbox или Grid. Я приведу пример для Flexbox, который вы можете отразить в своем собственном случае, и вы сможете найти другой. 

.container {
  display:flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
 }
 
 img {
  width: 400px;
  height: 400px;
  margin-right: 10px;
 }
<div class = "container">
<img src = "https://www.w3schools.com/howto/img_avatar.png" alt = "Image" />

<p>Some text</p>
</div>

Идея заключается в том, что вам нужно обернуть изображение и текст родительским элементом div и сделать его Flexbox. 

flex-direction: row;     => Place the items side by side

justify-content: center; => Center the items horizontally

align-items: center;     => Center the items vertically

Я призываю вас проверить это руководство о Flexbox

...