2 Bilder nebeneinander
Guten Abend,
ich wollte mich mal erkundigen wie ich 2 Bilder nebeneinander machen kann, mit einem Text.
Der hier verwendete Code
<style>
.name2 {
font-size: 20px;
font-family: Arial Black;
color: red;
}
.rush p {
font-size: 20px;
font-family: Coiny;
background-color: rgba(226,240,0,0.4);
width: 100%;
text-align:center;
}
.rush img {
border: 5px solid #DCD80C;
padding: 5px;
margin: 0px 20px;
border-radius: 50%;
height: 150px;
width: 150px;
}
.cloud p {
font-size: 20px;
font-family: Coiny;
background-color: rgba(226,240,0,0.4);
width: 300px;
}
.cloud img {
border: 5px solid #DCD80C;
padding: 5px;
margin: 0px 70px;
border-radius: 50%;
height: 150px;
width: 150px;
}
main{
display:flex;
flex-direction:column;
justify-content: center;
}
#content{
display:flex;
justify-content: center;
}
nav{
display:flex;
justify-content: center;
}
nav p{
font-size:25px;
font-weight:900;
}
.rush{
display:flex;
flex-direction:column;
margin:auto;
border:1px solid black;
}
.rush{
margin:0;
}
</style>
<main>
<nav><p>Server Managment</p></nav>
<div id="content">
<div class="rush">
<img src="/image/avatar_user4825_1577104569.jpg" alt="" border="0">
<p class="name2">GleichZeitig_YT</p>
</div>
<div class="rush">
<img src="/image/avatar_user4825_1577104569.jpg" alt="" border="0">
<p class="name2">GleichZeitig_YT</p></div>
<div class="rush">
<img src="/image/avatar_user4825_1577104569.jpg" alt="" border="0">
<p class="name2">GleichZeitig_YT</p>
</div>
</div>
</main>