注册 登录
编程论坛 WEB前端(UI)

DIV样式问题,高手帮忙看一下!

孤独冷雨 发布于 2008-07-05 14:56, 1572 次点击
在IE页面里显示是正常的.但在Dreamweaver 8中显示时 tbd这一个区域掉下来了,在往下做时看着很难受.请问怎么解决?我是刚接处到这一块不懂,有懂的帮忙解决一下!

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.
<html xmlns="http://www.
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>div+css</title>

<style type="text/css">
<!--
body{
margin:0px;
background:#CCC;
}

#body{
width:800px;
height:500px;
text-align:center;
background:#FF00FF;
margin:0 auto;
padding:0px;
}

#menu{
float:left;
width:800px;
height:30px;
margin:0px;
background:#FF7F00;
clear:both;
}

#menu li{
float:left;
margin:0 10px;
list-style:none;
height:30px;
color:#fff;
display:block;
vartical-align:middle;
line-height:30px;
font-size:12px;
background:FF7F00;
}

 .line{
width:1px;
height:20px;
background:red;
line-height:20px;
}

#nav{
float:left;
height:5px;
width:800px;
background:#FFF;
margin:0px;
Padding:0px;
clear:both;
line-height:5px;
}

#main{
margin-top:5px;
float:left;
height:400px;
width:800px;
}

#main_right{
float:left;
width:600px;
height:400px;
background:green;
}
.tba{
float:left;
height:195px;
width:295px;
vertical-align:center;
margin:0 auto;
background:#FFF000;
}

.tbb{
float:right;
height:195px;
width:295px;
background:blue;
}

.tbc{
float:left;
height:195px;
width:295px;
margin-top:10px;
margin-right:10px;
background:#FFF000;
}

.tbd{
float:right;
height:195px;
width:295px;
background:blue;
margin-top:10px;
}

#main_left{
float:right;
width:190px;
height:400px;
background:green;
clear:right;
}

.tba h3{
width:295px;
height:22px;
line-height:22px;
vertical-align:center;
txet-align:center;
background:#ff99ff;
font-size:12px;
padding:0px;
}

.ur{
margin:0px;
padding-left:10px;
}

.tba li{
list-style-type:disc;
float:left;
color:#000;
font-size:12px;
line-height:22px;
padding-left:5px;
clear:both;
}

#foot{
widht:800px;
height:50px;
line-height:50px;
background:#FFF;
margin-top:10px;
}


-->
</style>
</head>

<body>
<div id="body">
    <div id="menu">
        <ul>
            <li>首 页</li>
            <li class=line><li>
            <li>公司简介</li>
            <li class=line><li>
            <li>新闻动态</li>
            <li class=line><li>
            <li>产品推荐</li>
            <li class=line><li>
            <li>在线留言</li>
            <li class=line><li>
            <li>联系我们</li>
        </ul>
    </div>
    
    <div id="nav">&nbsp;</div>
    
    <div id="main">
    
      <div id="main_right">
      
        <div class="tba">
        <h3>tba</h3>
        <ul class="ur">
            <li>111111111111</li>
            <li>222222222222</li>
            <li>333333333333</li>
            <li>444444444444</li>
            <li>555555555555</li>
            <li>666666666666</li>
        </ul>
        </div>
        
        <div class="tbb">tbb</div>
        <div class="tbc">tbc</div>
        <div class="tbd">tbd</div>
        
        </div>
        
        <div id="main_left">main_left</div>
        
    </div>
    
    <div id="foot">foot</div>
</div>
</body>
</html>

[[it] 本帖最后由 孤独冷雨 于 2008-7-5 14:59 编辑 [/it]]

[[it] 本帖最后由 孤独冷雨 于 2008-7-5 17:04 编辑 [/it]]
4 回复
#2
孤独冷雨2008-07-05 17:00
没有人回答自己顶一下!
#3
yms1232008-07-05 23:10
Dreamweaver就是那个样子,这属于这个软件编辑区的显示问题。
#4
huangyong2008-07-06 09:31
这个事软件问题,没关系的。

最主要的就是要在浏览器中看到是好的,其他的我认为都是次要的。

因为不管是客户或者是老板,他看的都是结果和外表,里面的东西你自己方便维护就行了。
#5
晨晨2008-09-23 17:41
.tba{
float:left;
height:195px;
width:295px;
vertical-align:center;
margin:0 auto;
background:#FFF000;
}

.tbb{
float:left;
height:195px;
width:295px;
background:blue;
}

.tbc{
float:left;
height:195px;
width:295px;
margin-top:10px;
margin-right:10px;
background:#FFF000;
}

.tbd{
float:left;
height:195px;
width:295px;
background:blue;
margin-top:10px;
}
这样改就可以啊
1