Using the Instafeed.js plugin to create a dynamic Instagram feed. Everything is working smoothly, but I'm struggling to center the images being retrieved by Instafeed. Despite trying various methods, I can't seem to get it to display as desired.
Here is my HTML code:
<!DOCTYPE html>
<head>
<title>Scenekvelder</title>
<link rel="stylesheet" type="text/css" href="style.css">
<script type="text/javascript" src="/instafeed.js"></script>
<script type="text/javascript">
var feed = new Instafeed({
get: "tagged",
tagName: "de3musketereroslo",
clientId: "d07f4ce08c6d4251b9fbb813d1fae305",
resolution: "standard_resolution",
limit: 1,
sortBy: "most-recent"
});
feed.run();
setInterval(function () {location.reload()}, 10000);
</script>
</head>
<body>
<h1>Live Instagram Feed #De3MusketererOslo</h1>
<main>
<div id="wrapper" class="center">
<div id="insta-wrap">
<div id="instafeed"></div>
</div>
</div>
</main>
</body>
</html>CSS:
body {
background: #000000;
}
h1 {
color: #FFFFFF;
text-align: center;
padding-top: 2cm;
}
.center {
align-items: center;
}