Image Overlay with light-box and link icons on card

hi semicolon

I would like to add an overlay to the cards images with link and lightbox

but when I use normal code samples from the canvas-demo, the overlay always spans to the whole card
even if I wram the image and overlay

can you please help?

this is a partial from my typo3-cms extension where I integrated the code
it renders ONE SINGLE CARD

	
		

      

        

		  
			
			
				
					
						
							
								
							
							
								
							
							
								
							
						
					
				
			
			
				
					
						
							
								
							
						
					
				
			
		

          
            
				
					{newsItem.title}
				
			
            
				
					
						
							{newsItem.teaser -> f:format.crop(maxCharacters: '{settings.cropMaxCharacters}', respectWordBoundaries:'1') -> f:format.html()}
						
						
							{newsItem.bodytext -> f:format.crop(maxCharacters: '{settings.cropMaxCharacters}', respectWordBoundaries:'1') -> f:format.html()}
						
					
				
			
			» Details «
          
        
      

essentially it should be integrated into the if clause

``

oh and sorry for the mess in custom.css ... all still under development

here a better link
https://typo3-dev.modellbauservice.com/blank/
its shows the overlay on full card, I would like to have it only on image

never mind ... stupid me, was missing a grid on parent div to make the overlay work
all fine, sorry to bother

case closed