Блог

Как вы можете видеть из приведенного ниже примера, .absolute_child позиционируется относительно поля заполнения .relative_parent . Как я могу расположить его в верхней части поля содержимого .relative_parent вместо этого? Я готов добавить дополнительные элементы (например, вложенные divs) в HTML, поскольку, как правило, это то, что мне приходится делать для более неудобных макетов!

 .relative_parent {
    position: relative;
    
    height: 100px;
    padding: 30px;
    
    background-color: green;
}

.absolute_child {
    position: absolute; 
    top: 0px;
    
    height: 10px;
    width: 10px; 
    
    background-color: blue;
}  

 <div class="relative_parent">
    Content box of parent starts here
    <div class="absolute_child">
    </div>
</div>