在他们的css转换的元素意外的行为

我已经写了一些元素的css，它会导致一些意想不到的行为。我使用：在他们的css转换的元素意外的行为

transition: 0.2s;

当刷新页面，这个CSS属性的元素，在页面的其他区域意外开始，并移动到其设定位置（在我的CSS的其他部分集）。的，

position: absolute

属性用于元素的位置，这可能是造成这个意外的行为？

这里是链接的CSS：

.subLinks_links { 
    position: relative; 
    width: 100%; 
    height: 50px; 
    line-height: 50px; 
    text-align: left; 
    border-top: 1px solid #ebebeb; 
    border-bottom: 1px solid #ebebeb; 
    font-size: 13px; 
    color: #999; 
    margin-bottom: -1px; 
    cursor: pointer; 
    text-transform: uppercase; 
} 

.subLinks_links > span { 
    margin-left: 30px; 
    -webkit-transition: 0.2s; 
    -moz-transition: 0.2s; 
    -o-transition: 0.2s; 
    transition: 0.2s;

}

.subLinks_links:hover > span { 
    margin-left: 40px; 
}

和有关HTML的CSS：

<div id="subLinks"> 

    <div class="subLinks_links_selected"><span>Link Text</span></div> 

    <div class="subLinks_links"><span>Link Text</span></div> 

</div>

来源

2014-11-02 Ryan Castle

请发布您的整个CSS代码和相关的HTML。 – Scimonster 2014-11-02 19:28:49

已添加相关代码。 – 2014-11-02 19:32:30

@Scimonster - 你会帮忙吗？ – 2014-11-02 20:05:12

我发现，这是一个定位问题。我正在使用文本对齐和空白左边来定位元素。没有死亡的定位，导致不需要的行为。

来源

2014-11-02 20:33:50

我想我遇到了类似的问题。您正在使用简写transition属性，该属性实际上是翻译为transition: all 0.2s ease 0.2s;。 all在这里很重要。这意味着无论出于何种原因（例如悬停效果等），您正在使用的转换也将其自身应用于其他css属性。在这种情况下，这些元素将专门用于更改布局，并且由于这些属性将覆盖默认值，所以每个更改的属性都会从默认值转换为css。

我知道你已经为你的情况找到了解决办法，但是对于其他可能在稍后遇到此问题的人来说，这是一个可能的解决方案。

来源

2014-12-13 20:35:42 0dyss3us

在他们的css转换的元素意外的行为

回答

相关问题