The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums CSS Add and overlay div in nested flex-box container

Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
  • #273435

    I was not able to add an overlay div over nested flex-container.
    The design is 3×3 grid inside an “target region”, Inside of each cell of the grid it has another 3×3 grid.


    The overlay should be over the inner grid but the position absolute or relative always mess up.
    Any Idea how to do it?


    First you may add .FlexContainer{position: relative;}
    Next a few changes for the Overlay:

    .FlexContainer .Overlay {
        position: absolute;
        top: 0;
        left: 0;
        margin: 0;
        border: none;
        width: 100%;
        height: 100%;
        background-color: rgba(013, 130, 230, 0.5);
        cursor: not-allowed;

    I hope it helps.


    That worked like a charm! Thanks.


    Well, my brother is a web designer and he has 5 years of experience in this field. I heard your post link when I gather some information for window film colorado springs sites on the internet. I found your post on this website. I tell my brother about this and I hope my brother will help you. Thank you so much for sharing this post with us.

Viewing 4 posts - 1 through 4 (of 4 total)
  • The forum ‘CSS’ is closed to new topics and replies.