Will the layout work on other devices?

Question

css

Here's my problem...
Now I'm starting to practice more - I'm laying out layouts. I get the result as in the layout - everything is fine with this. But I think I'm doing something wrong. Here is an example of my code.
HTML:

<div class="start">
    <div class="container">
      <div class="text">
        <div class="title">Привет!</div>
          <ul class="hi">
            <li>У тебя все получится!</li>
            <li>Никогда не сдавайся!</li>
            <li>Позвони нам!</li>
            <li>Напиши нам!</li>
          </ul>
        </div>
        <img class="people" src="img/Layer_3.png" alt="photo">
    </div>

CSS:

body {
  font-family: Arial;
  width: 1280px;
}

.start {
  height: 325px;
  background: #445162;
  padding: 50px 50px 50px 50px;
}

.text {
  color: white;
  margin-right: 270px;
}

.title {
  font-size: 60px;
  margin: 0 0 40px 0;

}

.hi li {
  background: url(img/check_icon.png) left no-repeat;
  padding-left: 35px;
}

.hi {
  font-size: 20px;
  line-height: 36px;
}

.container {
  max-width: 1186px; 
  height: 226px;
  display: flex;
  margin: 0 auto;
  justify-content: space-between;
}

Is it necessary to measure EVERYTHING so meticulously and indicate pixels? Is it ok to set the body width? Personally, it seems to me that all this will "jump" on other devices - there will not be the result that I now see in front of me. Or is it more adaptive?

PS Perhaps the question is strange, but as for me, it’s better to understand now what is wrong, and not later, when you are already used to some particular algorithm of actions))

Answer 1

if everything is set in pixels, then yes, on devices with a resolution less than your width, there will be a horizontal scroll. An adaptive is needed if the client pays for it: D
PS It is
better to write codes on codepen.io or jsfiddle and insert them into habr qna like this: