
上面两个版块就正常,可是下面的两个版块就不能靠在一起
我是删除别人的代码实现这一效果的,自己并不会代码。怎样可以实现下面两个版块靠在一起,如要小的在左应该怎样怎样做,在右又应该怎样做?
我把人家的代码改乱了,好心人能帮我看看就好了,这是导航网站的代码来的
CSS代码如下:
/* www.966996.com */
body,html{
padding:0;margin:0;
font:normal 12px/15px Verdana, Arial, sans-serif;
text-align:center;
}
*{margin:0;padding:0;}
ul{list-style:none;}
a img{border:0;}
h1,h2,h3,h4,h5,h6{font-size:12px;}
sup{color:#f00;font-family:Verdana;font-size:11px;font-weight:bold;}
a{
font-size:12px;color:#000;
font-family:Verdana, Arial, sans-serif;
text-decoration:none;
}
a:hover{
color:#787878;
text-decoration:underline;
}
.input{
margin:2px 5px 0 0;
width:400px;
height:25px;
color:#003300;
border:1px solid #57CBE8;
background:#f3f3f3;
font-family: Verdana, Arial, sans-serif;
font-size: 20px;
font-weight: bold;
}
button{
margin:2px;width:50px;
height:20px;
cursor:hand;
color:#12A9D0;
border:1px outset #A9E0FA;
background:#f3f3f3;
}
.select{
float:left;
display:inline;
margin-top: 2px;
margin-right: 2;
margin-bottom: 2px;
margin-left: 2;
border: 1px solid #3E91B8;
}
.select>div{
width:140px;height:17px;
overflow:hidden;
}
* html .select div select{
display:block;float:left;
margin:-2px;color:#fff;
background:#52BEE2;
}
.select div>select{
display:block;width:144px;
float:none;margin:-2px;
color:#fff;
background:#52BEE2;
}
#zhao {
position:absolute;
top:0;
left:0;
width:104px;
height:104px;
z-index:99;
}
#top{
position:relative;
width:760px;
height:70px;
background:#fff;
text-align:center;
border: 1px solid #F3F3F3;
margin-top: 0;
margin-right: auto;
margin-bottom: 0;
margin-left: auto;
}
#top h1{
position:relative;
top:0px;
left:0px;
float: left;
}
#top h2{
position:relative;
top:0px;
left: 6px;
float: left;
}
#top h3{
position:relative;
top:0px;
right: 0px;
float: right;
}
#head{
position:relative;
top:5px;
right: 0px;
height: 20px;
width: 758px;
border: 1px solid #8dc400;
background-color: #8dc400;
font-family: Arial, Helvetica, sans-serif;
line-height: 20px;
font-size: 12px;
color: #FFFFFF;
left: 0px;
}
#head a{
color: #FFFFFF;
}
#head h1{
float: left;
text-indent: 7px;
}
#head h2{
float: right;
position: relative;
right: 7px;
}
#top img{
margin-top: 5px;
margin-right: 0px;
margin-bottom: 5px;
margin-left: 0px;
}
#top ul{
position:absolute;
top:93px;
left:216px;
width:544px;
height:20px;
background:#fff;
}
#top li{
float:left;
width:80px;
height:20px;
padding:4px 0 0 0;
}
h5 object{
width:760px;
height:20px;
}
#main{
position:relative;
width:760px;
margin-top: 5px;
margin-right: auto;
margin-bottom: auto;
margin-left: auto;
}
#main1{
float:left;
width:216px;
background-color:transparent;
position: relative;
left: 0px;
margin-top: 0px;
margin-right: 0px;
margin-bottom: auto;
margin-left: 0px;
}
#main2{
float:right;
width:538px;
background-color:transparent;
position: relative;
right: 0px;
margin-top: 0px;
margin-right: 0px;
margin-bottom: auto;
margin-left: 0px;
}
#main1 #xinwen{
position:relative;
margin:5px 0 0 0;
width:216px;
height:131px;
}
#main1 #xinwen{
background:#57CBE8;
}
#main1 #wzfl{
float:left;
margin:5px 0 0 0;
width:216px;
height:106px;
overflow:hidden;
border-bottom:1px solid #CC0066;
background:#CC0066;
}
#xinwen h2,#wzfl h2{
margin:1px;
width:214px;
height:22px;
text-align:left;
line-height:22px;
color:#000;
}
#wzfl h2{
background:#CC6699;
}
#xinwen h2 a,#wzfl h2 a{
margin:2px 0 2px 0;
padding:2px;
color:#fff;
}
#xinwen a:hover,wzfl h2 a:hover{
text-decoration:none;
}
#xinwen p{
float:RIGHT;
margin:0 1px 0 0;
}
#xinwen p a{
font-weight:normal;
border:0;
color:#fff;
text-decoration:none;
}
#xinwen p a{
background:#40B8D6;
}
#xinwen ul{
font-family:宋体, Verdana, Arial, sans-serif;
margin:0 0 1px 1px;
width:214px;
height:106px;
overflow:hidden;
position: relative;
}
#xinwen ul{
background:#F3FBFD;
}
#wzfl ul{
font-family:宋体, Verdana, Arial, sans-serif;
margin:0 0 1px 1px;
width:214px;
height:674px;
background:#fefefe;
}
#xinwen li{
margin:1px 0 0 0;
height:19px;
line-height:19px;
text-align:left;
color:#787878;
overflow:hidden;
}
#wzfl li{
padding:0 0 0 1px;
}
#wzfl li a{
float: left;
line-height:24px;
height:24px;
width:70px;
text-align:center;
color:#000;
border-bottom:1px solid #f1f1f1;
overflow: hidden;
}
#wzfl li a:hover{
color:#C0C0C0;
text-decoration:none;
}
#xinwen li a{
color:#000;
}
#xinwen li a:hover{
color:#C0C0C0;
text-decoration:underline;
}
#main2 #news,#main2 #sports{
position:relative;
margin:5px 0 0 0;
width:538px;
height:131px;
}
#main2 #news{
background:#14bfcd;
}
#main2 #sports{
background:#CC0066;
}
#news h2,#sports h2{
width:538px;
height:24px;
line-height:24px;
font-weight:normal;
text-align:RIGHT;
color:#fff;
}
#news h2{
background:#14bfcd;
}
#sports h2{
background:#CC0066;
}
#news h2 a,#sports h2 a{
margin:2px 0 2px 2px;
padding:2px;
font-weight:bold;
color:#fff;
}
#news h2 a:hover,#sports h2 a:hover{
text-decoration:none;
}
#news ul,#sports ul{
margin:0 0 0 1px;
width:536px;
height:104px;
>height:105px;
overflow:hidden;
}
#news ul{
border-top:1px solid #3E91B8;
text-align:center;
background:#FFF;
}
#sports ul{
border-top:1px solid #CC0066;
background:#FFF;
}
#news li,#sports li,i{
height:25px;
line-height:25px;
overflow:hidden;
color:#5a5a5a;
}
#news .libg1{
height:28px;
border-top:1px dashed #A6DCEE;
background:#E1F2F6;
}
#sports .libg1{
height:28px;
border-top:1px dashed #CC0066;
background:#FFF0F8;
}
#news .libg1 a{color:#006E88;}
#sports .libg1 a{color:#006600;}
#news span,#sports span,{
float:right;
margin:0 2px 0 0;
}
#news span a,#sports span a{
border:0;
font-weight:normal;
}
#news span a{
color:#fff;
background:#14BFCD;
}
#sports span a{
color:#fff;
background:#99CC00;
}
#news span a:hover, #sports span a:hover{
color:#fff;
}
#news li a,#sports li a{
margin:0 4px 0 4px;
color:#000;
}
#news li a:hover, #sports li a:hover{
color:#C0C0C0;
text-decoration:underline;
}
#link{
position:relative;
float:left;
margin:5px 0 auto;
width:760px !important;
width:762px;
}
#link a{
float:left;
line-height:22px;
height:22px;
margin:1px;
padding:0 0 0 5px;
width:100px;
color:#999999;
text-align:center;
overflow: hidden;
background:#f3f3f3;
}
#link a:hover{
color:#000;
overflow:hidden;
text-decoration: underline;
}
#bottom{
position:relative;
width:760px!important;
width:758px;
height:100px;
color:#6a6a6a;
border:1px solid #f3f3f3;
background:#fff;
margin-top: 5px;
margin-right: 0;
margin-bottom: auto;
margin-left: 0;
}
#bottom h2{
width:760px;
height:25px;
font-weight:normal;
background:#f3f3f3;
line-height: 25px;
}
#bottom a{
color:#5a5a5a;
line-height:24px;
}
#bottom h3{
position:relative;
font-weight:normal;
line-height:25px;
width:760px;
height:50px;
}
#bottom h3 img{
position:absolute;
top:5px;
left:600px;
width:25px;
height:33px;
}
#bottom h4{
position:relative;
font-weight:normal;
line-height:25px;
width:760px;
height:25px;
}
#main1 #ystj {
margin:5px 0 0 0;
width:216px;
height:131px;
background:#57CBE8;
}