クロムのcssは、検査要素の後にしか動作しません。

Question

フレックススライダのJQueryプラグインを使用して、私のサイトの複数の要素をスライドショーしています。 FlexSliderを適用する要素には、JQuery .click()イベントとfadeIn() fadeOut()エフェクトも使用します。

私のサイトはFirefoxでうまく見えますが、クロームで開くとスライドは1ページに積み重ねられます。私が混乱させるのは、chromeのinspect要素を使用すると、firefoxのようにレイアウトを正しく設定することです。

誰でも何が起こっているのか説明できますか？

EDITED：いくつかの検査の後 大丈夫、レイアウトの変更幅/高さが変更された場合、ので、ここで私は正しく表示されない要素に使うCSSだ：

#content{ 
    width: 80%; 
    margin: 2% 10%; 
    padding: 3% 1%; 
    -webkit-border-radius: 10px; 
     -moz-border-radius: 10px; 
      border-radius: 10px; 
    background-color: rgba(255,255,255,0.5); 
    -webkit-box-shadow: 0 2px 3px 0 #aaa; 
     -moz-box-shadow: 0 2px 3px 0 #aaa; 
     box-shadow: 0 2px 3px 0 #aaa; 
    } 
h2{ 
    width: 80%; 
    margin: 5% 10%; 
    color: #808080; 

    font-family: "Lobster", Arial; 
    font-weight: bold; 
    font-size: 5em; 

    line-height: 1em; 
    text-align: center; 
} 

flexslider #content内にあり、スライド内にはh2タグの要素があります。

Answer 1

これは、CSSまたはHTML自体にエラーがある場合に発生することがあります。

http://validator.w3.org/

http://jigsaw.w3.org/css-validator/

か、スライダページのコードを提供します。

はあなたのコードをチェックしてみます。

Answer 2

は私が.triggerを持っていた後、CSSは（「クリック」）

をロードしません同様の問題があったと私はクロームの要素を検査に使用する場合には、持っていることによって、私は問題を解決し

ロード.trigger前に一時停止（ 'クリック'）は、例えば

がトリガーされます。

$('#workDone').click(function(){ 

      setTimeout(function(){$('#mefirst').trigger('click');}, 100); //providing delay to buffer load time of css 


      });