zepp
/
my-cafe-events
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

create image map container 

create container div
style and position with css
This commit is contained in:
emma 2025-01-29 22:07:31 -05:00
parent 87b5df9248
commit 57604e0be7
2 changed files with 17 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
cafe-events/valentines-day-25/index.html
View File

@ -9,6 +9,7 @@
<body> <body>
<div class="container"> <div class="container">
<div class="chocolates"></div>
<img src="./img/sweets.jpg" alt="a box of chocolate cupcakes"> <img src="./img/sweets.jpg" alt="a box of chocolate cupcakes">
</div> </div>
<script src="./script/script.js" defer></script> <script src="./script/script.js" defer></script>

17
cafe-events/valentines-day-25/style/style.css
View File

@ -20,10 +20,25 @@ body {
.container { .container {
height: 75vh; height: 75vh;
width: auto; width: auto;
position: relative;
z-index: 0;
}
.chocolates {
height: 44vh;
width: 18vw;
top: 15vh;
left: 6vw;
padding-left: 1.25rem;
padding-top: 1.25rem;
padding-right: .5rem;
position: absolute;
z-index: 1;
} }
img { img {
max-height: 100%; max-height: 100%;
width: auto; width: auto;
object-fit: contain; object-fit: contain;
} }