消除div标签之间的差距

Question

There is an unnecessary gap between two divs..Is there any solution to remove that?
Here is the jsfiddle
If you observe the vUiTsTabs and vUiTsContainers div tags, you will find a gap between those two divs...(gap between black and red border).

Answer 1

clear the <ul> tag ( overflow: auto; is enough) and remove display: inline-block; from .vUiTsTabs

demo here: http://jsfiddle.net/FCwjc/3/

Answer 2

用display: inline-block替换float: left for li

Answer 3

remove the display and clear the float:left on the lis by setting

display:inline-block;
overflow:hidden; /*or auto*/

for .vUiTsTabs and the gap will disappear: modified fiddle

Answer 4

I hope this may be helpful to you
use this .vUiTsTabs code

.vUiTsTabs {
border-bottom: 1px solid #660033;
display: table;
margin: 0;
width: 99.9%;
}

Demo: modified demo

Answer 5

我将其固定在Chrome上，将“ vertical-align：top”放入您的vUiTsTab中。

Answer 6

Please try this:

Use following css:

.vUiTsTabs {
   display: table;
   border-bottom: 1px solid #660033;
   width: 99.9%;
}