首页新闻找找看学习计划

几个div元素在同一行显示的问题

0
[已解决问题] 解决于 2012-12-04 22:21

我的问题是如果不设置display:inline;的话就能显示,加上他之后就显示不了了,让我很郁闷

这是HTML

<html>
<title>
<title>Mypage</title>
<script type="text/javascript" src="temp.js"></script>
<link rel="stylesheet" href="temp.css"  type="text/css"/>
<body>
<div id="box">
    <div id="box1"></div>
    <div id="box2"></div>
    <div id="box3"></div>
    <div id="box4"></div>
    <div id="box5"></div>
    <div id="box6"></div>
</div>
</body>
</html>

这是javascript:

window.onload = initAll;

function initAll() {
    var id = document.getElementById("box");
    var littleBoxs = id.childNodes;
    var j = 0;
    for(var i = 0;i <littleBoxs.length;i++){
        if(littleBoxs[i].id != null){
        if(parseInt(littleBoxs[i].id.substr(3,1)) % 2 == 0){
            littleBoxs[i].className = "classRed";
        } else {
            littleBoxs[i].className = "classYellow";
        }
    }
    }
}

这是CSS:

#box {
    height:100px;
    width:600px;
}
.classRed {
    background-color:red;
    display:inline;
    width:100px;
    height:100px;
}
.classYellow {
    background-color:yellow;
    display:inline;
    width:100px;
    height:10px;
}
wen858636827的主页 wen858636827 | 菜鸟二级 | 园豆:208
提问于:2012-12-04 01:00
< >
分享
最佳答案
0

唉,这确实不是个问题的地方,这是我在其他地方得到的答案。

因为如果设定了display:inline; div的大小会自动收缩;如果设置了display:block;又打不到效果,所以我用float:left代替了

wen858636827 | 菜鸟二级 |园豆:208 | 2012-12-04 14:00
其他回答(1)
0
chenping2008 | 园豆:9836 (大侠五级) | 2012-12-04 09:11

这是啥意思呀,解释一下行吗????

支持(0) 反对(0) wen858636827 | 园豆:208 (菜鸟二级) | 2012-12-04 12:30

@wen858636827: 这个网址上有很详细的解释的

支持(0) 反对(0) chenping2008 | 园豆:9836 (大侠五级) | 2012-12-04 13:01

@chenping2008: 我看了一遍又一遍,就是没发现能解决我的问题的解释,大神,解释一下呗

支持(0) 反对(0) wen858636827 | 园豆:208 (菜鸟二级) | 2012-12-04 13:15
清除回答草稿
   您需要登录以后才能回答,未注册用户请先注册