Блог

Я хотел переместить свой div из нижнего левого в верхний правый, ofc отзывчивый, как это сделать? Извините, если вы не понимаете, это визуальное представление:

и мой код

 <div class="" style="margin-left: -32px; margin-top: -24px; margin-right: -32px;"> {# TODO: responsive margin #}
        <div class="w-100 position-relative logo-relative-box" style="height: 400px">
            <div class="position-absolute shadow-5 w-100"
                 style="top: 0; height:350px; background-color: rgba(255,255,255, 0)">

            </div>
            {# Tło#}
            <div id="profile-background" class="w-100 text-center shadow-5 position-absolute"
                 style="
                    height: 300px; top: 0;
                    background: url('{{ asset('upload/profile/background/night_sky.jpg') }}');
                    background-size: cover;
                    display: table; z-index: 4
                         ">
                <div id="typed" style=""></div>
            </div>

            <span class="marquee" style="z-index: 4">test</span>
            <img src="{{ asset('upload/avatars/'~profile.Username~'/'~profile.AvatarFileName)|imagine_filter('my_thumb_even_larger') }}"
                 class="rounded-circle shadow-5 img-thumbnail position-absolute mine-avatar" alt=""
                 style="right: 25%; left: 75%; margin-left: -75px; bottom: 40px; height: 150px; width: 150px;z-index:4">
            <div class="position-absolute" style="padding-left: 75px; right: 0; bottom: 100px; z-index:5; width:25%; height:300px;">
                <div class="row h-100 align-items-end">
                    <div class="col-12 demo pl-3">
                        {% if profile.facebook != '' or profile.twitter != '' or profile.linkedin != '' or profile.reddit != '' or profile.skype != '' or profile.flickr != '' or profile.instagram != '' or profile.youtube != '' %}
                            {% if profile.facebook != '' %}
                                <a href="https://www.facebook.com/{{ profile.facebook }}/" class="align-bottom btn btn-icon rounded-circle btn-outline-default bg-white hover-highlight mr-1 fs-xl" style="color:#3b5998"><i class="fab fa-facebook-square"></i></a>
                            {% endif %}
                            {% if profile.twitter  %}
                                <a href="https://twitter.com/{{ profile.twitter }}" class="btn btn-icon rounded-circle btn-outline-default bg-white hover-highlight mr-1 fs-xl" style="color:#38A1F3"><i class="fab fa-twitter-square"></i></a>
                            {% endif %}
                            {% if profile.linkedin != '' %}
                                <a href="https://www.linkedin.com/in/{{ profile.linkedin }}/" class="btn btn-icon rounded-circle btn-outline-default bg-white hover-highlight mr-1 fs-xl" style="color:#0077B5"><i class="fab fa-linkedin"></i></a>
                            {% endif %}
                            {% if profile.reddit != '' %}
                                <a href="https://www.reddit.com/user/{{ profile.reddit }}/;" class="btn btn-icon rounded-circle btn-outline-default bg-white hover-highlight mr-1 fs-xl" style="color:#000000"><i class="fab fa-reddit-alien"></i></a>
                            {% endif %}
                            {% if profile.skype != '' %}
                                <a href="skype:{{ profile.skype }}?chat" class="btn btn-icon rounded-circle btn-outline-default bg-white hover-highlight mr-1 fs-xl" style="color:#00AFF0"><i class="fab fa-skype"></i></a>
                            {% endif %}
                            {% if profile.flickr != '' %}
                                <a href="https://www.flickr.com/photos/{{ profile.flickr }}" class="btn btn-icon rounded-circle btn-outline-default bg-white hover-highlight mr-1 fs-xl" style="color:#0063DC"><i class="fab fa-flickr"></i></a>
                            {% endif %}
                            {% if profile.instagram != '' %}
                                <a href="https://www.instagram.com/{{ profile.instagram }}" class="btn btn-icon rounded-circle btn-outline-default bg-white hover-highlight mr-1 fs-xl" style="color: #833ab4"><i class="fab fa-instagram"></i></a>
                            {% endif %}
                            {% if profile.youtube != '' %}
                                <a href="https://www.youtube.com/channel/{{ profile.youtube }}" class="btn btn-icon rounded-circle btn-outline-default bg-white hover-highlight mr-1 fs-xl" style="color: #c4302b"><i class="fab fa-youtube-square"></i></a>
                            {% endif %}
                        {% endif %}
                    </div>
                </div>
            </div>

        </div>

    </div>
  

что я уже пробовал? Я не знаю, я искал это в Google, но ничего не нашел, я даже не знаю, как правильно сформулировать этот вопрос.