I don't seem to be able to apply css positioning. I have a layout of images with borders and a large bottom padding to include some text like a caption.
Each image is set within a parent div which has position:relative. Within the parent div I've created a child div with position:absolute to insert some headings and paragraphs. I've also tried setting the child div with position:relative but in either case I cant get the child div to sit underneath the image. I thought position:absolute would allow me to position the div relative to the parent div?
Here's the page. If anyone can suggest how I would position the child div within the parent div, I'd be grateful.
Looking at your site, I don't see the image or the caption being positioned absolute. The caption is commented out as well. It's a little difficult to troubleshoot this way.
@Paulie_D : normally I would agree but with absolute positioning, it's easy to make sure that the captions are always at the same height, regardless of the image height.
@Paulie_D - such a simple and elegant solution! Wish I had thought of it.
@Senff - thanks for replying, I commented out the 'caption' to show the images displaying nicely, but I guess it didn't help with the troubleshooting. I'm still not sure why the absolute positioning didnt work :( so I'll probably be posting here again.
I don't seem to be able to apply css positioning. I have a layout of images with borders and a large bottom padding to include some text like a caption.
Each image is set within a parent div which has position:relative. Within the parent div I've created a child div with position:absolute to insert some headings and paragraphs. I've also tried setting the child div with position:relative but in either case I cant get the child div to sit underneath the image. I thought position:absolute would allow me to position the div relative to the parent div?
Here's the page. If anyone can suggest how I would position the child div within the parent div, I'd be grateful.
Instead of all that positioning, why not use the figure/figcaption elements and floats?
http://codepen.io/anon/pen/wvjGC
Looking at your site, I don't see the image or the caption being positioned absolute. The caption is commented out as well. It's a little difficult to troubleshoot this way.
@Paulie_D : normally I would agree but with absolute positioning, it's easy to make sure that the captions are always at the same height, regardless of the image height.
@Paulie_D - such a simple and elegant solution! Wish I had thought of it.
@Senff - thanks for replying, I commented out the 'caption' to show the images displaying nicely, but I guess it didn't help with the troubleshooting. I'm still not sure why the absolute positioning didnt work :( so I'll probably be posting here again.