• Status: Solved
  • Priority: Low
  • Security: Public
  • Views: 34
  • Last Modified:

Text Block Over the image Gallery

How to create Text Block Over the image Gallery with same positions.
Untitled-1.png
0
shri ram
Asked:
shri ram
  • 2
1 Solution
 
Julian HansenCommented:
CSS
<style type="text/css">
.textblock {
  width: 50%;
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 1000;
  transform: translateY(-50%) translateX(-50%);
  background: white;
  color: #333;
  padding: 15px;
  border-radius: 5px;
}
.gallery {
	margin-bottom: 30px;
}
.gallery img {
	width: 100%;
  border-radius: 5px;
}
.gallery-container {
	position: relative;
}
</style>

Open in new window

HTML
<div class="textblock">
		Some text for the text block<br>
		Some text for the text block<br>
		Some text for the text block<br>
		Some text for the text block<br>
		Some text for the text block<br>
		</div>

Open in new window


Working sample here
1
 
shri ramAuthor Commented:
Thank You.....
0
 
Julian HansenCommented:
You are welcome.
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

Join & Write a Comment

Featured Post

Free Tool: SSL Checker

Scans your site and returns information about your SSL implementation and certificate. Helpful for debugging and validating your SSL configuration.

One of a set of tools we are providing to everyone as a way of saying thank you for being a part of the community.

  • 2
Tackle projects and never again get stuck behind a technical roadblock.
Join Now