Hi guys,
I was including an Image Component into a Container. When I am now giving the Container a Border the Image in the Container is always above the Border. See screenshot. I played around with Z-Index but the result stays the same. Is that as it should be? Or a bug?
Have you tried any of the following …
I think this is exacted behavior due to the way HTML/CSS works.
As @maxken suggested, you can add some padding to the container, just to bring the contents in a little.
I tested this solution and it works just fine 
Hi @maxken thanks for your suggestions! I tried them all and they are working well.
@dan although the suggestions of Ken are working, is this really as it should be? The container on top should always have the lead and when there is an option for a border, the border should be visible and not below the sub-component. It took me nearly an hour to recognise that there is a border on the container but it is below the picture (the picture originally was set to fill the container in width and height, so the picture was completely covering the border of the container).
ok another option is to use use the border on the container as intended, on the image component set the same size border and set the opacity of the image border to 0
not tried, but as long they are the size should be ok?
While it looks like it’s on top in the node tree, that’s not how it works. Sub-items are layered on top; this is how HTML/CSS works.
Item 1 is the background. Anything inside of it will layer over it. Notice how the Container item sits on top of it, and the same applies to the SVG.
If it were the other way around, you wouldn’t see any of the sub-items. The blue box and SVG would be hidden.
Hope that makes sense and clears up any confusion.
not sure if this is the question / answer, I assume if it just the left righ tborders you want you would just set them, maybe something else you are asking not this
@dan, I understand your explanation and if this the way it should work I have to adjust my logic wether I like it or not 
@upssjw and @maxken thanks for your suggestions.
What I want to achieve is a kind of “Bento-Gallery”. You can have a look at the below website:
The images are in a container and have a hover “zoom effect”. What I want to achieve is an additional “photo frame” around the pictures. The “photo frame” should not zoom - therefore I thought a border around the container would be the right way, but learned it isn’t.
I got it. Putting a container with the image in a container is doing the trick. Sometimes the power of Elements is too much for me
I have published it and if you want you can see it here:
Cool thats what I do
You can even get the border to change color this way
yes, its the same way. Instead of changing the color I have added a shadow 
Have a nice Sunday!
