Here is the code snippet from my website:
body {
background-image: url('background.jpg');
background-repeat: no-repeat;
background-attachment: fixed;
background-size: cover;
}
.centered {
/* Center entire body */
display: flex;
justify-content: center;
align-items: center;
position: static;
}<!DOCTYPE html>
<html>
<head>
<title>Training File Upload</title>
<link rel="stylesheet" href="index.css">
</head>
<body>
<div class="centered">
<div class="child">
<br><br><br><br>
<img src="logopng.png" style="width:450px;height:550px;">
<form method="POST" action="http://68.227.63.30:100/upload.php" enctype="multipart/form-data">
<span>Choose midi files:</span> <br>
<input type="file" name="file[]" multiple required/>
<br><br>
<input type="submit" name="submit" value="Upload for training" />
</form>
</div>
</div>
</body>
</html>https://i.stack.imgur.com/PWrv9.jpg
I had initially centered the content on my website, but adding the logo caused a layout issue. I may need to specify coordinates to fix this. Any suggestions would be appreciated!
Thank you in advance for any assistance!