CSS styles break when adding database content using PHP, what's wrong?

Question

PHP

Good day! Prepared in advance styles for the site:

<div class="wrapper">
  
    <nav>
      <div class = "logo"></div>
      <ul>
        <li><a href = "login.html">Войти</a></li>
        <li><a href = "index.html#aboutme">Обо мне</a></li>
        <li><a href = "blog.html">Блог</a></li>
        <li><a href = "index.html#getintouch">Обратная связь</a></li>
      </ul>
    </nav>
    
    <main>
      <h1>Привет! Добро пожаловать в мой Блог!</h1>
  <?php
    require_once ('main_blog.php');

    while ($note = mysqli_fetch_array($select_note))
    {
  ?>
      <div class = "information">
        <!--<p>Кат: <a href = "#">Кино, Знаменитости</a></p>
        <p><a href = "#" class = "likes">136 Нравится</a></p>-->
  <?php require_once('count_comments.php') ?>
        <p><a href = "#" class = "comments"><?php echo $allcomments_num;?> Комментарий</a></p>
      </div>
      <div class = "post">	
        <div class = "date"><?php $note['created'] = date("d M"); echo $note['created'];?></div>
        <h2><?php echo $note['title'];?></h2>
        <p><?php echo $note['article']; ?></p>
  <?php
    }
  ?>
        <a href = "#">Читать дальше</a>
      </div>
    </main>

Here is the CSS:

.wrapper main {
  padding: 50px 110px;
  background: #fff;
  color: #323232;
  height: 710px; /*Временный параметр*/
}
.wrapper main h1 {
  color: #323232;
  font-size: 1.1em;
  text-align: center;
  margin-bottom: 60px;
}
.wrapper main .date {
  position: absolute;
  top: 110px;
  left: 90px;
  color: #2eb398;
  font-size: 1.3em;
  font-weight: bold;
  border: 3px solid #2eb398;
  border-radius: 50%;
  padding: 35px 10px;
}
.wrapper main .information {
  padding: 0 20px;
  margin-bottom: 20px;
  margin-left: 76px;
  border-bottom: 1px solid #2eb398;
}
.wrapper main .information p,
.wrapper main .information a {
  display: inline-block;
  margin-bottom: 5px;
  color: #323232;
  font-size:  0.95em;
  margin-right: 5px;
}
.wrapper main .information a {
  text-decoration: none;
  border-right: 2px solid #2eb398;
  padding-right: 10px;
}
.wrapper main .information a:hover {
  color: #2eb398;
}
/*.wrapper main .information .likes,
.wrapper main .information .comments {
  background: url(../images/spritecomlikes.png) no-repeat -10px -40px;
}*/
.wrapper main .information .comments {
  background: url(../images/spritecomlikes.png) no-repeat -10px -6px;
  padding-right: 0;
  margin-right: 0;
  border-right: 0;
  padding-left: 25px;
}
.wrapper main .post {
  margin-left: 85px;
  margin-bottom: 20px;
  padding-bottom: 50px;
  border-bottom: 2px dashed #2eb398;
}
.wrapper main .post h2,
.wrapper main .post p {
  color: #323232;
  margin-bottom: 20px;
  font-size: 1em;
}
.wrapper main .post h2 {
  font-size: 1.5em;
  font-weight: bold;
}
.wrapper main .post p {
  line-height: 1.5em;
  margin-bottom: 25px;
}
.wrapper main .post a {
  text-decoration: none;
  color: #fff;
  background: #2eb398;
  padding: 7.5px;
  border-radius: 10px;
  font-size: 0.85em;
}

So, the first post is displayed as it should, but the next ones go at random. As I understand it, it depends on the place where I insert the PHP code. How to do all this correctly so that the styles do not go astray?

Answer 1

Your closing tag for <div class = "post">is in the wrong place.

<div class="wrapper">

    <nav>
        <div class = "logo"></div>
        <ul>
            <li><a href = "login.html">Войти</a></li>
            <li><a href = "index.html#aboutme">Обо мне</a></li>
            <li><a href = "blog.html">Блог</a></li>
            <li><a href = "index.html#getintouch">Обратная связь</a></li>
        </ul>
    </nav>

    <main>
        <h1>Привет! Добро пожаловать в мой Блог!</h1>
        <?php
        require_once ('main_blog.php');

        while ($note = mysqli_fetch_array($select_note))
        {
        ?>
        <div class = "information">
            <!--<p>Кат: <a href = "#">Кино, Знаменитости</a></p>
            <p><a href = "#" class = "likes">136 Нравится</a></p>-->
            <?php require_once('count_comments.php') ?>
            <p><a href = "#" class = "comments"><?php echo $allcomments_num;?> Комментарий</a></p>
        </div>
        <div class = "post">
            <div class = "date"><?php $note['created'] = date("d M"); echo $note['created'];?></div>
            <h2><?php echo $note['title'];?></h2>
            <p><?php echo $note['article']; ?></p>

            <a href = "#">Читать дальше</a>
        </div>
        <?php
        }
        ?>
    </main>

Answer 2

No, they closed the post)