Как сделать поочерёдное выведение текста?

Question

Как сделать поочерёдное выведение текста?

vlad plotnikov Ученик (143), на голосовании 1 год назад

Здравствуйте, делаю мессенджер, как сделать чтобы сообщения выводились не так:
:Привет Влад
:Что делаешь?
Привет соня

а так:
:Привет Влад
Привет соня:
:Что делаешь?

сложно, но я надеюсь что вы поняли

<div class="content-message-pole">
<?php
$content_message = mysqli_query($db, "SELECT * FROM `message_content` WHERE `from_id` = $my_id AND `u_id` = $id ORDER BY `message_content`.`id` ASC ");
while ($content = mysqli_fetch_assoc($content_message) ){?>


<div class="message-content-u">

<p><?php echo $content['content']; ?></p>

</div>
<?php }; ?>


<?php
$mycontent_message = mysqli_query($db, "SELECT * FROM `message_content` WHERE `u_id` = $my_id AND `from_id` = $id ORDER BY `message_content`.`id` ASC ");
while ($mycontent = mysqli_fetch_assoc($mycontent_message) ){?>
<div class="message-content-from">

<p><?php echo $mycontent['content']; ?></p>

</div>
<?php }; ?>
</div>

вот такой у меня код на вывод сообщений из бд.
Так же вот такой css:

.content-message-pole{
width: 95%;
height: 450px;
margin: 0 auto;
overflow-y: scroll;
border: 1px solid red;
}
.message-content-u{

padding: 10px;
max-width: 10%;
max-height: 100%;
max-width:45% ;
border-radius: 10px;
background-color: silver;
}

.message-content-from{
letter-spacing: 0.5px;
word-spacing: 1px;
padding: 10px;
max-width:45% ;
border-radius: 10px;
background-color: skyblue;
margin-left: 50%;
border: 1px solid black;
display: ;
}
надеюсь поможете)

Answer 1

 $all_messages = mysqli_query($db, "SELECT * FROM `message_content` WHERE (`from_id` = $my_id AND `u_id` = $id) OR (`u_id` = $my_id AND `from_id` = $id) ORDER BY `message_content`.`id` ASC ");  
 
while ($message = mysqli_fetch_assoc($all_messages) ){ 
    if ($message['from_id'] == $my_id) { 
        // Это сообщение от меня 
        echo '' . $message['content'] . '
'; 
    } else { 
        // Это сообщение от другого пользователя 
        echo '' . $message['content'] . '
'; 
    } 
} 
?>

 .message-content-from { 
    float: right; 
    clear: both; 
} 
 
.message-content-u { 
    float: left; 
    clear: both; 
}