如何处理ipad safari CSS 样式的兼容性？

如上图【由三个DIV组成的圆角框，中间DIV 两端出现了间隙】主流PC浏览器都能显示正确的效果，唯独IPAD Safari 出现这样的差异。不清楚是什么原因造成的，知道的朋友指教。

以下为布局
<div id="roleArea">
  <div class="boxLeft"><img src="codebase/bot/images/web/bar_headerLeft.png" /></div>
  <div class="boxMiddle">
  <ul>
  <li> <img src="codebase/bot/images/web/icon_chatbtn.png" id="chatIcon" /> </li>
  <li><span><b>Role</b></span> <asp:Label ID="LabUserRole" runat="server" Text="Label" ToolTip="click here to change role"></asp:Label></li>
  <li><span><b>User</b></span> <asp:Label ID="LabUserName" runat="server" Text="Label"></asp:Label> </li>
  </ul>
  </div>
  <div class="boxRight"><img src="codebase/bot/images/web/bar_headerRight.png" /></div>
  </div>

------解决方案--------------------
这样能看出什么啊。。。没css也没办法测试