<!DOCTYPE html>
<head>
<style>
body {
background-image: url('https://www.hdwallpapers.in/download/renegade_raider_skin_in_blur_blue_background_fortnite_hd_games-1920x1080.jpg');
background-size: cover;
background-repeat: no-repeat;
background-postion: center;
}
.flex-container {
display: flex;
justify-content: center;
flex-wrap: nowrap;
background-color: rgba(0, 255, 0, 0);;
}
.flex-container > div {
background-color: rgba(29, 137, 238, 0.7);;
flex: 1 1 100px;
width: 200px;
height: 80px;
margin: 20px;
text-align: center;
line-height: 80px;
font-size: 50px;
}
</style>
</head>
</style>
</head>
<body>
<center><font color ="#ffffff" size="20px"><b>FortHub's Shop</b></font></center>
<br>
<center><font color="#fffff" size="7px"><p2>Stock and prices can be found below</p2><br></center>
<center><font color="#fffff" size="6px"><p2>You can purchase an account by joining the discord and telling a staff member!</p2><br></center>
<center><font color="white">Click the button to join!<br><a href="https://discord.gg/wKb8cF8Q7s" target="_blank"><img src="https://emoji.gg/assets/emoji/6812_disc.png" width="64px" height="64px" style='vertical-align: middle;'></center></a>
<div class="flex-container">
<div>Account #1</div>
<div>Account #2</div>
<div>Account #3</div>
</div>
</body>
I would like to make it so that I have the flex-container displaying 3 boxes, I got that, but how or where would I put the tag so that the image I want appears below and is in line with each individual box?
note: I do not want the image to repeat i just want 3 individual images, 1 below each box
question from:
https://stackoverflow.com/questions/65849688/where-would-i-put-my-img-tag-in-order-to-get-it-below-my-flex-container 与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…