Окно уведомлений для перемещения с изменением размера экрана HTML

Question

У меня есть «всплывающее» уведомление, которое мне нужно переместить при изменении размера экрана.У меня есть этот стиль, который позиционирует и делает окно уведомления:

<style>
    .ajax-dropdown
    {position:absolute;
     display:none;
     z-index:905;
     top:48px;
     left:80%;
     width:280px;
     height:435px;
     border-radius:0;
     -webkit-border-radius:0;
     -moz-border-radius:0;
     -webkit-box-shadow:0 2px 4px rgba(30,30,100,.25);
     -moz-box-shadow:0 2px 4px rgba(30,30,100,.25);
     box-shadow:0 2px 4px rgba(30,30,100,.25);
     padding:10px;
     background:#fff;
     border:1px solid #b3b3b3}
</style>

Затем я вызываю действие, которое заполняет данные в окне уведомления:

<div id="logo-group" style="background-color:white !important" class="btn-header pull-right">
   @if (Request.IsAuthenticated)
   {
       @Html.Action("GetNotifications", "Notifications")
   }
</div>

Вышеупомянутое действие вызывает этот частичныйview, который извлекает данные для отображения:

@model Innovation_Cafe.ViewModels.NotificationListViewModel

<span id="activity" class="activity-dropdown"> <i class="fa fa-user"></i> <b class="badge"> @Model.NotificationCount </b> </span>

<!-- AJAX-DROPDOWN : control this dropdown height, look and feel from the LESS variable file -->
<div class="ajax-dropdown">
    <!-- the ID links are fetched via AJAX to the ajax container "ajax-notifications" -->
    <div class="btn-group btn-group-justified" data-toggle="buttons">

        <label class="btn btn-default">
            <input type="radio" name="" value="notifications" @*id="~/content/ajax/notify/notifications.html"*@>
            notifications @*(6)*@
        </label>
    </div>

    <!-- notification content -->
    <div class="ajax-notifications custom-scroll">
        @Html.Partial("_notifications", Model)
    </div>
</div>
<!-- END AJAX-DROPDOWN -->

Итак, я поиграл со стилем, упомянутым в первом бите кода, поэтому я могу изменить его размер, переместить его, ноЯ понятия не имею, как заставить его «двигаться» со всеми элементами при изменении размера экрана.

Я пытался поместить его в сторону тега media, но, похоже, он не работает.:

@@media only screen and (max-width : 960px) {

}

Если кто-нибудь может помочь мне в правильном направлении, я был бы очень признателен.