Tôi đang sử dụng plugin JQuery flexslider để trình chiếu một số thành phần trong trang web của mình. Tôi cũng sử dụng sự kiện JQuery .click()
và hiệu ứng fadeIn() fadeOut()
trên các yếu tố áp dụng flexslider.css trong chrome chỉ hoạt động sau khi kiểm tra phần tử
trang web của tôi có vẻ tốt trong firefox, nhưng khi tôi mở trang web bằng chrome, các trang trình bày được xếp chồng lên nhau trong một trang. nhưng những gì gây nhầm lẫn cho tôi là, khi tôi sử dụng phần tử kiểm tra trong chrome, nó đặt bố trí đúng, giống như trong firefox.
ai có thể giải thích điều gì đang xảy ra không?
EDITED: ổn sau khi một số kiểm tra, bố trí thay đổi khi chiều rộng/chiều cao được thay đổi, vì vậy đây là css tôi sử dụng trên các yếu tố đó không hiển thị đúng:
#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;
}
các flexslider được đặt trong #content
và bên trong các trang trình bày là các thành phần có các nhãn h2
jsFiddle mẫu, vui lòng? – moey