为什么它左浮动不起作用，这些代码

Question

我的问题是，为什么左浮动不能在这些代码下工作 当我使用它们的所有结果只显示在单独的div和其他7显示在同一位置的div下所以请告诉我这是什么概率

<div class="tv_l" style="top:1465px; 
left:10px; 

position:absolute; 

width:1690px; 
height:10px; 
border-radius:3px/3px; 
padding-right:10px; 
padding-top:px; 
border-left:10px;"> 

<hr> 
</div> 


<?php 

$link = mysqli_connect("localhost" , "***" ,"***" , "***"); 
if (mysqli_connect_errno()) { 
echo mysqli_connect_error(); 
exit(); 
} else { 
    echo ""; 
} 
?> 
<?php 
$result = mysqli_query($link, "SELECT * FROM **** ORDER BY RAND() 
LIMIT 8") 
or die(mysqli_error()); 
while($row = mysqli_fetch_array($result)){ 
?>; 



<div class="son_s_p" style="top:1957px; 
left:12px; 
-webkit-box-shadow:0 3px 8px rgba(0, 0, 0, .25); 
position:inherit; 
background:white; 
width:190px; 
height:240px; 
border-radius:3px/3px; 
padding-right:10px; 
padding-top:px; 
border-left:10px; 
text-align:center; 
float:left; 

"> 



<img src="../lu/music/tumb/<?php echo $row['img']; ?>"style="width:198px; height:148px;" > 
<br> 

<?php echo $row['name']; ?><br><br> 

<div id="son_s_p" style="top:218px; 
left:px; 

position:absolute; 


border-radius:3px/3px; 
padding-right:10px; 
padding-top:px; 
border-left:10px; 
text-align:justify;"> 


&nbsp;<?php echo $row['time']; ?> &nbsp; &nbsp;<span class="time&amp;type" style="top;10px;"><?php echo $row['type']; ?></span> 

</div> 
</div> 

<?php 
} 
?> 

with using position

without using position data will go top and top do not work

Answer 1

你的错误的解决方案是，你把格“浮动：左;”和多数民众wrong.you应该把它的风格属性之前就把它是Style="float: left;"

正确的代码是：

<div class="tv_l" style="top:1465px; 
left:10px; 

position:absolute; 

width:1690px; 
height:10px; 
border-radius:3px/3px; 
padding-right:10px; 
padding-top:px; 
border-left:10px;"> 

<hr> 
</div> 


<?php 

$link = mysqli_connect("localhost" , "***" ,"***" , "***"); 
if (mysqli_connect_errno()) { 
echo mysqli_connect_error(); 
exit(); 
} else { 
    echo ""; 
} 
?> 
<?php 
$result = mysqli_query($link, "SELECT * FROM **** ORDER BY RAND() 
LIMIT 8") 
or die(mysqli_error()); 
while($row = mysqli_fetch_array($result)){ 
?>; 



<div class="son_s_p" style="top:1957px; 
left:12px; 
-webkit-box-shadow:0 3px 8px rgba(0, 0, 0, .25); 
position:inherit; 
background:white; 
width:190px; 
height:240px; 
border-radius:3px/3px; 
padding-right:10px; 
padding-top:px; 
border-left:10px; 
text-align:center; 
float:left; 

"> 



<img src="../lu/music/tumb/<?php echo $row['img']; ?>"style="width:198px; height:148px;" > 
<br> 

<?php echo $row['name']; ?><br><br> 

<div id="son_s_p" style="top:218px; 
left:px; 

position:absolute; 


border-radius:3px/3px; 
padding-right:10px; 
padding-top:px; 
border-left:10px; 
text-align:justify;"> 


&nbsp;<?php echo $row['time']; ?> &nbsp; &nbsp;<span class="time&amp;type" style="top;10px;"><?php echo $row['type']; ?></span> 

</div> 
</div> 

<?php 
} 
?> 

Answer 2

你的问题还不清楚，但是我已经清理你的代码，以便在div .tv_l是对左格.son_s_p和它的内容：

.tv_l { 
 
    border-radius: 3px/3px; 
 
    padding-right: 10px; 
 
    border-left: 10px; 
 
    border: 1px solid; 
 
    float: left; 
 
} 
 

 
.son_s_p { 
 
    -webkit-box-shadow: 0 3px 8px rgba(0, 0, 0, .25); 
 
    background: white; 
 
    width: 190px; 
 
    height: 240px; 
 
    border-radius: 3px/3px; 
 
    padding-right: 10px; 
 
    border-left: 10px; 
 
    text-align: center; 
 
    float: left; 
 
} 
 

 
#son_s_p { 
 
    border-radius: 3px/3px; 
 
    padding-right: 10px; 
 
    padding-top: px; 
 
    border-left: 10px; 
 
    text-align: justify; 
 
}

<div class="tv_l"> 
 
    <hr> 
 
</div> 
 

 
<?php 
 
$link = mysqli_connect("localhost" , "***" ,"***" , "***"); 
 
if (mysqli_connect_errno()) { 
 
    echo mysqli_connect_error(); 
 
    exit(); 
 
}else{ 
 
    echo ""; 
 
} 
 

 
$result = mysqli_query($link, "SELECT * FROM **** ORDER BY RAND() 
 
LIMIT 8") 
 
or die(mysqli_error()); 
 
while($row = mysqli_fetch_array($result)){ 
 
?> 
 

 
<div class="son_s_p"> 
 
    <img src="../lu/music/tumb/<?php echo $row['img']; ?>" style="width:198px; height:148px;"> 
 
    <br> 
 
    <?php echo $row['name']; ?> 
 
    <br> 
 
    <br> 
 
    <div id="son_s_p"> 
 
     <?php echo $row['time']; ?> 
 
     <span class="time&amp;type" style="top;10px;"><?php echo $row['type']; ?></span> 
 
    </div> 
 
</div> 
 

 
<?php } ?>

Answer 3

它看起来像你在你的DIV上使用绝对定位。花车不能这样工作。使用这个来代替：

position: static; 
float: left; 

如果我是你，我会先设法得到它与纯HTML和CSS一些虚拟数据的工作，它钩到数据库之前。

这里是如何可以实现浮动与div的，相反你的方法的例子：由于你是绝对定位的东西，所有的地方，可能是大部分

https://jsfiddle.net/19zrr99n/