3

I'm trying to figure out how to overlay a div on top of an image.

Here's what I've got so far, I'm totally stuck and have been for a while.

http://wilwaldon.com/learning/slideshow.html

Any help would be greatly appreciated, thank you in advance.

Improve this question
1

3 Answers 3

Reset to default
4

Try adding position:absolute; on the overlay. You might also want to add background:transparent if you want the image to show through.

Improve this answer
Sign up to request clarification or add additional context in comments.

Comments

1 
<style type="text/css"> .image{ position:relative; width:1001px; height:257px; } .overlay{ position:absolute; left:0; bottom:0; width: 300px; background-color: #fff; z-index: 600; } </style>

Changes from original:

  1. Add dimensions of the image to the container, and set its position to relative

  2. Set overlay position to absolute and position it by top/bottom and left/right properties

Improve this answer

1 Comment

Thank you. That's exactly what I needed. Now that I look at it I feel a bit ashamed haha. Thanks again, you rule!
1

You could set the image as the background of your Div.

background-image: url (blahblahblah);

Improve this answer

Comments

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.