擺脫2 div之間的無用空間

我已經搜索谷歌，但我沒有找到任何東西。我搜索這個網站，發現這個話題Unwanted space between divs這似乎是相似的，我已經嘗試應用擺脫2 div之間的無用空間

margin:0px;

幾個地方，但我仍然時，兩個div之間的空間。

我的繼承人HTML

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 
<html> 
<head> 
    <title>title/title> 
<link rel="stylesheet" type="text/css" href="e.css"> 
</head> 


<body> 

<div id="page"> 

    <div id="content"> 
     <div id="up"> 
      <div id="tab"> 
        <ul id="tabmenu"> 
       <li id="anm" class="tbs blue"><a href="#"><span>Anm</span></a></li> 
       <li id="kom" class="tbs blue"><a href="#"><span>Kom</span></a></li> 

       <li id="omt" class="tbs blue"><a href="#"><span>Omt</span></a></li> 
       <li id="sts" class="tbs blue"><a href="#"><span>Sts</span></a></li> 
       </ul> 
     </div> 

     <div id="usrp"> 
      <div id="usr"> 
      </div> 
     </div> 
    </div> 

    </div> 

    <div id="bottom"> 

    </div> 
</div> 
</body> 
</html>

而且我的CSS

html { 
    height: 98%; 
} 

body { 
    height:99%; 
} 

#page { 
    height:99%; 
} 

#content { 
    /*border:2px solid blue;*/ 

} 

#bottom { 
    border:2px solid green; 
    height:15%; 
    vertical-align: bottom; 
} 

#up { 
     /*border:dotted green 2px;*/ 
     width:59%; 
} 

.usrcom { 
    border-bottom: 2px dotted blue; 
    margin-left:15px; 
    margin-right:15px; 
} 

#usrp { 
    width:100%; 
    clear:both; 
    border-right: 2px solid blue; 
    border-left: 2px solid blue; 

    border-bottom:2px solid blue; 
    border:dotted yellow 2px; 


} 

/***Tabs menu*****/ 
#tabmenu { 
    float:left; 
    width:685px; 
    /*background:#BBD9EE;*/ 
    /*background:#FF6633;*/ 
    font-size:93%; 
    line-height:normal; 
    margin-top: 0px; 
    margin-left: 0px; 

    /*border:dotted red 2px;*/ 
    border-bottom:2px solid blue; 
    /*border:dotted red 2px;*/ 


} 

#tabmenu ul { 
    /*background:#BBD9EE;*/ 
    padding:0px 0px 0 0px; 
    margin:0px; 
    list-style:none; 
    border:dotted green 2px; 
} 

#tabmenu li { 
    display:inline; 
    padding:0; 
    margin:0px; 
} 

#tabmenu a { 
    float:left; 
    /*background:url("img/tableft2.png") no-repeat left top;*/ 
    margin:0; 
    padding:0 0 0 4px; 
    text-decoration:none; 
} 

#tabmenu a:hover span { 
background-color:#3399FF; 
margin:0px; 
border-top-left-radius: 15px; 
    border-top-right-radius: 15px; 
} 

#tabmenu a span { 
    float:left; 
    display:block; 
    /*background:url("img/tabright2.png") no-repeat right top;*/ 
    padding:5px 15px 4px 5.5px; 
    margin:0px; 
    color:#FFFFFF; 
    background-color:#0000FF; 

    border-top-left-radius: 15px; 
    border-top-right-radius: 15px; 
}

我可以找出爲什麼空間會發生，如何解決這種不必要的空間。

編輯：

UPS，yearh，忘記告訴它的DIV，

這是 'Tabmenu' 和 'USRP' 之間

編輯：

試圖在我的CSS應用

#tab { 
    margin: 0px; 
    padding:0px;

}

因爲它確實在'tab'和'usrp'之間，但是沒有任何幫助。

來源

2011-06-29 Thomaxz

http://jsfiddle.net/blineberry/AhHvu/你說哪個div的呢？ – Brent

哪2個div？你有幾個在那裏。 – kei

已更新告訴哪一個，divs之間，它介於'Tabmenu'和'usrp' – Thomaxz

在CSS：

#tabmenu { 
    margin:0; 
}

應該做的伎倆

來源

2011-06-29 21:09:00 Pasman

它的確如此。謝謝。 – Thomaxz

瞭解如何使用檢查員並「檢查此元素」。然後，您可以將鼠標懸停在頁面上的所有元素上，從字面上看到它們的邊距/填充以及CSS導致它們的原因。您甚至可以在應用之前即時編輯CSS以測試修補程序。我的首選是Firefox的Firebug附加組件，但Chrome，Safari，甚至Internet Explorer都已經內置了它們。

來源

2011-06-29 21:03:10 Michael

擺脫2 div之間的無用空間

回答

相關問題