php - 如何在单个div中显示两行div

Question

我使用 for 循环在一行中显示 div。第一个 div 显示完成但插入新的 div。 如何插入与第一个 div 相同的新 div。先谢谢了。 现在这显示为 -

"first-div first-div first-div first-div first-div first-div first-div first-div "

现在我想使用相同的 for 循环在第一个 div 下面显示另一个 div。

我想要这样-

"first-div first-div first-div first-div first-div first-div first-div first-div"

"minor-div minor-div minor-div minor-div minor-div minor-div minor-div minor-div"

CSS 代码-

#default-Div{
overflow-x: scroll;
width: 830px;
white-space:nowrap;
height: 110px;

.calender-column{
width:160px;
height:110px;    
border:1px solid #0174DF;
    display:inline-block; 

PHP - HTML 代码 -

<div id="default-Div"  >
<?php $temp=1; for($j=0;$j<30;$j++){?>

<div id="calender-column<?php echo $temp;?>" class="calender-column"   >

<?php $temp++; } ?>
</div>

Answer 1

您不能将 display: inline; 与 width 和 height 一起使用，因为那样将不再是内联的。您可以查看 CSS Specification on display了解更多详细信息。可以说，使用 display: inline;，这是不可能的。

值得庆幸的是，display 有一个新的(大概)属性值，它可以完全满足您的要求:display: inline-block; -- 在文档流，但有点像 block 级元素。

.calender-column{
width:160px;
height:110px;    
border:1px solid #0174DF;
    display:inline-block; }

...你会没事的:)

注意:唯一需要注意的是，inline-block 在 IE 6 或 7 中不起作用。但是，您可以将显示更改为纯粹的 inline两个浏览器，因为它们无论如何都错误地将 inline 呈现为 inline-block。