css-transitions - 如何在不影响调整大小的情况下使用过渡？

Question

我使用带有 'transition: margin-left 800ms ease-in-out;' 的 div 的'transition' 这实际上有效，但是当我缩小页面时，它同样慢。我能做些什么或者我怎样才能让它变得更好？

CSS:

 .calenderDiv {
    max-width: 1100px;      
    margin-left: 13em;
    padding-top: 10px;
    transition: margin-left 800ms ease-in-out;
  }
   
  .calenderDivFilter {
    max-width: 1300px;
    margin-left: 1.2em;
    padding-top: 10px;
  } 


Script:  Called by a button

function showDiv() {

    var eCalendarDiv = document.getElementById('calendarDivId');    
    var eCalendarClass = eCalendarDiv.className;
    
    if (eCalendarClass === 'calenderDiv') {
        eCalendarDiv.className = 'calenderDiv calenderDivFilter';
    }
    else {
        eCalendarDiv.className = 'calenderDiv';
    }
};

标签： css-transitions