I have this project assignment and I have difficulties with it, if I can get some assistance. What Im trying to do is I have a layout which contains grid box of 5 rows and two columns, within each grid box there are images in it, and Im trying to add several text inside/over each of the image on the grid box and I have tried many different method such as text over image block, and transparency, but doesn't seem to work, if you can recommend or help please, it will be great appreciated
and also please provide me some information how I can post next time, because its kind of difficult thanks
below are some of the code
````<html>
````<head>
````<style>
````.grid-container {
````display: grid;
````grid-template-columns: auto auto;
````grid-template-rows: auto auto auto auto auto;
````grid-template-areas: inherit;
````background-color: rgb(104, 104, 231);
````padding: 100px;
````}
````.grid-item {
````background-color: rgba(96, 129, 221, 0.8);
````border: 1px solid rgba(0, 0, 0, 0.8);
````padding: 5px;
````font-size: 30px;
````text-align: center;
````grid-row: auto;
````width: "10";
````vertical-align: inherit;
````height: "5";
````}
````.text-block {
````position: absolute;
````bottom: 60%;
````right: 80%;
````background-color: black;
````color: white;
````padding-left: 20px;
````padding-right: 20px;
````}
````.centered {
````position: absolute;
````top: 80%;
````left: 50%;
````transform: translate(-50%, -50%);
````font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
````font-size: larger;
````}
````</style>
````</head>
````<body>
````<h2 style=color:blueviolet>Destination</h2>
````<div class="grid-container">
````<div class="grid-item1">
````<img src="https://www.marathoncoach.com/wp-content/uploads/2018/02/Banff-1140x642.jpg" width="720px" ````height="480px" alt="nature">`
````</div>
````<div class="grid-item2">
````<img src="https://content.r9cdn.net/rimg/kimg/71/ef/f431b339-16489292bf8.jpg?````width=568&height=350&crop=true&caller=HotelDetailsPhoto" width="720" height="480">
````</div>
````<div class="grid-item3"><img
````src="https://www.worldtravelguide.net/wp-content/uploads/2018/06/shu-NorthAmerica- ````DominicanRepublic-CapCana-411057478-PretoPerola-1441x823px.jpg"
````width="720" height="480"></div>
````<div class="grid-item4"><img
````src="https://travel.home.sndimg.com/content/dam/images/travel/fullset/2014/10/15/1b/dominican-````republic-resorts-the-reserve-at-paradisus.rend.hgtvcom.616.347.suffix/1491584478418.jpeg"
````width="720" height="480"></div>
````<div class="grid-item5"><img
````src="https://image.chitra.live/api/v1/wps/d25e76c/7c938097-26be-444a-9275-71edec4ce012/3/Bali-````Indonesia-580x358.jpeg"
````width="720" height="480"></div>
````<div class="grid-item6"><img
````src="https://www.timeshighereducation.com/sites/default/files/styles/the_breaking_news_image_style/p````ublic/istock-629183422.jpg?itok=ICdK2p-o"
````width="720" height="480"></div>
````<div class="grid-item7"><img
````src="https://www.nationalgeographic.com/content/dam/environment/photos/Urban-````Expeditions/London/02_london_i53138_18_06_28_10749-1-.adapt.1900.1.jpg"
````width="720" height="480"></div>## Heading ##