我已經創建了一個簡單的用戶控制的旋轉木馬,但每個滾動的當前顯示的部分出來的對齊約4.5px。雖然數字是正確的滾動不對齊的元素
它通過收集所有的直接祖先<section>
標籤它鉤在父容器的內部,設置在每個<section>
display: inline-block
和使每個<section>
相同的寬度。
的滾動由<section>
容器的margin-left
屬性設置爲負N * W,其中N是滾動<section>
標籤的數量和W是各自<section>
的寬度來實現。
的<section>
標籤和容器的padding
和margin
屬性已設置爲0
可能是什麼造成的?
JSFiddle:https://jsfiddle.net/835kxb2w/ - 我在<section>
標記中添加了邊框以使問題更加明顯。
此外,在我認爲是一個相關的問題(與模板中剩餘的空白?),最後一節打破了一條新線。儘管<section>
容器的寬度恰好是N * W像素。
感謝
'直列block'會使您的標籤之間的任何空間的頁面空間,換行符包括在內。你可以通過使用'float'來避免這種情況,通過刪除代碼中的空格/換行符,或者用'font-size:0px; – Santi