Html Float left在ipod、android智能手机等移动设备中不起作用
左浮动“li”在ipod和android设备中不起作用。但它在笔记本电脑/桌面电脑的所有主要浏览器中都能完美运行。代码如下:Html Float left在ipod、android智能手机等移动设备中不起作用,html,css,ipod,smartphone,Html,Css,Ipod,Smartphone,左浮动“li”在ipod和android设备中不起作用。但它在笔记本电脑/桌面电脑的所有主要浏览器中都能完美运行。代码如下: <ul class="clsvideos clearfix"> <li> <div class="home-thumb"> <div class="home-play-container"> <div class="play-button-hover">
<ul class="clsvideos clearfix">
<li>
<div class="home-thumb">
<div class="home-play-container">
<div class="play-button-hover">
<div class="movie-entry yt-uix-hovercard">
<div class="tooltip">
<a href="/index.php/component/deentube/player/Education-Travel/Abdul-Basit-reciting-Surah-Infitar" class="info_hover"><img class="yt-uix-hovercard-target" src="http://img.youtube.com/vi/pF6Yq7DrJKA/1.jpg" border="0" width="140" height="83" title=""> </a>
<div class="Tooltipwindow clearfix">
<img src="http://video.muslimbackyard.com/templates/videoplus/images/tip.png" class="tipimage">
<div class="clearfix"><span class="clstoolleft">Category : </span><span class="clstoolright">Education & Travel</span></div>
<span class="clsdescription">Description : </span><p>Abdul Basit reciting Surah Infitar - amazing tajweed! mash'Allah!</p><div class="clearfix"> <span class="clstoolleft">Rating : </span> <div class="clstoolright ratingvalue ratethis1 fivepos1"></div>
<div class="clearfix"><span class="clstoolleft"> Views:</span> <span class="clstoolright">58 </span></div>
</div>
</div>
</div>
</div>
</div>
<div class="show-title-container">
<a href="/index.php/component/deentube/player/Education-Travel/Abdul-Basit-reciting-Surah-Infitar" class="show-title-gray info_hover">Abdul Basit reciting Surah Infitar </a>
</div>
<span class="video-info"> <a href="/index.php/component/deentube/category/Education-Travel">Education & Travel </a> </span>
<div class="video-info clearfix">
<div class="clsratingvalue"><span class="ratethis1 fivepos1 "></span></div>
<div class="clsvideosviews">58 Views</div>
</div>
</div>
</div></li>
<li>
<div class="home-thumb">
<div class="home-play-container">
<div class="play-button-hover">
<div class="movie-entry yt-uix-hovercard">
<div class="tooltip">
<a href="/index.php/component/deentube/player/Sports-Gaming/How-the-Bible-Led-Me-to-Islam-The-Story-of-a-Former-Christian-Youth-Minister-Joshua-Evans" class="info_hover"><img class="yt-uix-hovercard-target" src="http://img.youtube.com/vi/IYMKQKSV0bY/1.jpg" border="0" width="140" height="83" title=""> </a>
<div class="Tooltipwindow clearfix">
<img src="http://video.muslimbackyard.com/templates/videoplus/images/tip.png" class="tipimage">
<div class="clearfix"><span class="clstoolleft">Category : </span><span class="clstoolright">Sports & Gaming</span></div>
<span class="clsdescription">Description : </span><p>How the Bible Led Me to Islam: The Story of a Former Christian Youth Minister - Joshua Evans</p><div class="clearfix"> <span class="clstoolleft">Rating : </span> <div class="clstoolright ratingvalue ratethis1 fourpos1"></div>
<div class="clearfix"><span class="clstoolleft"> Views:</span> <span class="clstoolright">41 </span></div>
</div>
</div>
</div>
</div>
</div>
<div class="show-title-container">
<a href="/index.php/component/deentube/player/Sports-Gaming/How-the-Bible-Led-Me-to-Islam-The-Story-of-a-Former-Christian-Youth-Minister-Joshua-Evans" class="show-title-gray info_hover">How the Bible Led Me to Islam: The ... </a>
</div>
<span class="video-info"> <a href="/index.php/component/deentube/category/Sports-Gaming">Sports & Gaming </a> </span>
<div class="video-info clearfix">
<div class="clsratingvalue"><span class="ratethis1 fourpos1 "></span></div>
<div class="clsvideosviews">41 Views</div>
</div>
</div>
</div></li>
实时网址:
注意:在智能手机中打开站点并取消停止。注意热门视频、最新视频部分的设计问题。你会知道问题在哪里
最早等待解决方案实际上问题是,开发人员没有关闭导致此错误的“li”中的最后一个“div”
因此,在编写核心php时,请小心使用前端代码。这是我给我的开发者的建议。我的LG P500看起来不错。。。此外,您还复制了一些CSS规则。宽度和浮动规则只需要在.clsvideos li选择器中声明。谢谢@decastro。实际上问题是,开发人员没有关闭导致此错误的“li”中的最后一个“div”。。。
.clsvideos li:first-child {
width: 140px;
float: left;
padding: 14px 10px 0 0;
display: block;
}
.clsvideos li {
height: 155px;
width: 140px;
padding: 14px 10px 0 9px;
border-right: 1px dotted #CFCFCF;
border-bottom: 1px dotted #CFCFCF;
float: left;
}