problems with position fixed

Question

problems with position fixed

Navigation

#1 by (1 votes)

0

I have 2 containers one with position relative and fixed

I explain that I am trying to give a width of 100% to the container that has the position fixed but it leaves the parent container, it needs the 100% of the parent container and having a position fixed .

How can I achieve this?

this is what I tried ....

.padre{

    position:relative;
    width:300px;
    height:300px;
    left: 0;
    top: 0;
    background: rgb(0,0,0,0.5);
    z-index: 1500;
    
    align-items: center;
    justify-content: center;
}
.hijo{

    position:fixed;
    width:100%;
    height:60px;
    left: 0;
    bottom: 0;
    clear:both;
    background: rgb(240,240,240,0.5);
    z-index: 1500;
    padding:10px;
}

<div class="padre">


<div class="hijo">
  bienvenido
</div>

 
</div>

css

asked by andy gibbs 04.10.2018 в 04:36

source

1 answer

PHP FOR & WHILE spaces to the right when passing data to input text in modal

score 1 · Accepted Answer

If you want the child to always stay at the father's feet, you can get it with position:absolute; instead of fixed . Please read the comment of @blonfu.

Remark: the z-index so big does not make sense.

.padre{

    position:relative;
    width:300px;
    height:300px;
    left: 0;
    top: 0;
    background: rgb(0,0,0,0.5);
    z-index: 1500;/*Que barbaridad!!*/
    align-items: center;
    justify-content: center;
}
.hijo{

    position:absolute;
    width:100%;
    height:60px;
    left: 0;
    bottom: 0;
    clear:both;
    background: rgb(240,240,240,0.5);
    z-index: 1500;/*Que barbaridad!!*/
    padding:10px;
}

<div class="padre">


<div class="hijo">
  bienvenido
</div>

 
</div>