Kan ikke få billede ud til højre
Her er koden til hele siden:@page
@model _27b.Pages.papegojer.guldparakitModel
@{
}
<!DOCTYPE html>
<html lang="da">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<!-- <link rel="stylesheet" href="styles.css"> <!-- Link til din CSS-fil -->
<style>
html, body {
height: 100%;
margin: 0;
padding: 0;
}
.container {
display: flex;
align-items: center; /* Center items vertically within the container */
height: 100%; /* Full height of the view */
width: 30%; /* 1/3 width of the screen */
position: absolute; /* Ensure the container covers the full height */
top: 0; /* Ensure the container starts from the top */
left: 0; /* Ensure the container starts from the left */
background-color: #f0f0f0; /* Optional background color */
}
.container img {
position: absolute;
right: 0;
max-width: 100%; /* Ensure the image scales within the container */
max-height: 100%; /* Ensure the image scales within the container */
object-fit: contain; /* Maintain aspect ratio of the image */
}
</style>
</head>
<body>
<div class="container">
<img src="/images-papegøjer/guldparakit.jpeg" alt="Guldparakit">
</div>
</body>
</html> <!-- her slutter siden -->
Billedet sidder lodret centreret i containeren. Problemet er at billedet sidder til venstre, det skal sidde til højre?
