>웹 프론트엔드 >HTML 튜토리얼 >如何处理ipad safari CSS 样式的兼容性?_html/css_WEB-ITnose

如何处理ipad safari CSS 样式的兼容性?_html/css_WEB-ITnose

WBOY
WBOY원래의
2016-06-21 09:46:071871검색

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

以下为布局

                        
如何处理ipad safari CSS 样式的兼容性?_html/css_WEB-ITnose

                        

                            

                                        
  •  如何处理ipad safari CSS 样式的兼容性?_html/css_WEB-ITnose 

  •                                     
  • Role  

  •                                     
  • User  

  •                                 

                        

                        
如何处理ipad safari CSS 样式的兼容性?_html/css_WEB-ITnose

                    

回复讨论(解决方案)

这样能看出什么啊。。。没css也没办法测试

应要求补CSS 
#roleArea 
{
height:39px; width:auto; 
overflow:hidden; 
float:left; 
margin-top:10px; 
margin-bottom:10px; 
      
}
#roleArea div 
{
height:39px; 
overflow:hidden;
padding:0; 
width:auto; 
float:left; 
margin:0; 
}
#roleArea div.boxMiddle
{
background:url("../images/web/bar_headerMiddle.png"); 
background-repeat:repeat-x;
}
#roleArea div.boxLeft,#roleArea div.boxRight{ width:20px;}
#roleArea ul 
{
list-style:none; 
margin:0 auto; 
padding:0; 
display:block; width:100%; overflow:hidden;

}
#roleArea ul li{ float:left; height:39px; overflow:hidden;}

#roleArea ul li span 
{
float:left; 
height:39px; 
line-height:39px; 
color:#666;
 }
#roleArea ul li span b{color:#006495}

你在样式里加个 img{border:0px}试试

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.