Margin left/right auto and 900px width is positioning with extra wide margin on the iPad/iPhone only
Question
The following profile maintains centering in the main browsers in OSX and WinXp. But is offset to the left in the iPad with the width shorten by the larger margin on the right.
.wrapper {
width: 900px;
margin-right: auto;
margin-left: auto;
position: relative;
border: 1px solid #9B9B9B;
}
<body>
<div class="wrapper">
:
</div>
</body>
I have an inline unordered list containing thumbs that w/o java enabled extends to the right beyond the wrapper. These images are contained within a div that is positive relative. Once JavaScript is enabled on the browsers, the page is centered.
Again, the problem is only in the iPad and the iPhone.
Is there a possible reason for this?
1 answers
solution1
1 ACCPTED 2010-11-20 19:48:12
For mobile devices, all div boundaries must fit within the '.wrapper' with javascript disabled in order for the margin left/right auto to work.
Once javascript executes, theres no problems with moving div's to the far left or right of the wrapper.
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.