styles.css

.container {
    border: 1px solid rgb(203 213 225);
    position: relative;
    width: 100%;
    height: 24rem;
}
.container--horizontal::before {
    content: '';
    position: absolute;
    top: 50%;
    left: 0;
    right: 0;
    height: 2px;
    transform: translateY(-50%);
    background-color: rgb(99 102 241);
}
.container--vertical::after {
    content: '';
    position: absolute;
    left: 50%;
    top: 0;
    bottom: 0;
    width: 2px;
    transform: translateX(-50%);
    background-color: rgb(99 102 241);
}

.draggable {
    background: rgb(203 213 225);
    height: 8rem;
    width: 8rem;

    position: absolute;
    top: 0;
    left: 0;

    /* Center the content */
    align-items: center;
    display: flex;
    justify-content: center;

    /* Indicate that the element is draggable */
    cursor: move;
    user-select: none;
    touch-action: none;

    z-index: 1;
}