z-index для разделения цвета фона и значка внутри одного элемента

Question

Я создаю цвет фона div givng для class = "content". Теперь я опишу порядок отображения данных 1, цвет фона выше 2, значки внутри тега над значками 3, заголовок и абзац * 1001.*

<div class="col col-md-4">
                <div class="content bg-secondary" style="z-index: 0">
                    <div class="test">

                    <span>
                        <i class="fa fa-meetup fa-2x" aria-hidden="true"></i>
                        <i class="fa fa-meetup" aria-hidden="true" style="font-size: 175px; z-index: 2 !important; position: absolute;"></i>
                  </span>
                        </div>
                    <div class="testt">
                    <h3 style="z-index: 4 !important;">Heading 1</h3>
                    <p style="z-index: 6 !important;"> content is entered here  entered here  entered here </p>
                        </div>
                </div>
            </div>

Answer 1

ссылка на эту ссылку https://bootsnipp.com/snippets/eNxGv z-index работает только тогда, когда вы подаете заявку на атрибуты позиции там или они получают позицию оттуда, родительский атрибут