0

It may sound a stupid question but I need this div2 behind the div1. But div2 is inside div1 and I need it this way. I tried with z-index but for some reason doesn't work. I even declared its position.

I want to display back-sq-1 behind the box-ft1.

Note that is not possible changing the order of divs, so obviously it would be much easier.

Here is the code:

HTML

<div class="box-ft1">
    <span class="back-sq-1"></span>
</div>

CSS:

    .box-ft1{
    position: absolute;
    z-index: 250;
    background-color: white;
    height: 230px;
    width: 400px;
    right: 5%; 
    top:15%;

}

    .back-sq-1{
        display: block;
        z-index: 0;
        top: -15px;
        left: -15px;
        width: 50%;
        height: 50%;
        position: absolute;
        background-color: #a36103;
    }
azhpo
  • 764
  • 3
  • 7
  • 18
  • Is there anything special about the span that means you can't just hide it? Then use `.box-ft1::before` sudo element to achieve the affect you want instead. – Lesley.Oakey Nov 14 '14 at 16:04
  • 2
    possible duplicate of [css parent element to appear above child](http://stackoverflow.com/questions/1806421/css-parent-element-to-appear-above-child) – web-tiki Nov 14 '14 at 16:05
  • @BojanPetkovski Ofc it is possible... – azhpo Nov 14 '14 at 16:08
  • @Lesley.Oakey Yes there is, it is a square to place behind its parent. – azhpo Nov 14 '14 at 16:13
  • @azhpo if it's just a coloured square then the same styling can just be applied to the `::before` element instead and `display: none` on your span. Read more about pseudo elements here: https://developer.mozilla.org/en-US/docs/Web/CSS/::before – Lesley.Oakey Nov 14 '14 at 16:20

0 Answers0