Css 带空格的内联块元素之间的间隙:nowrap和溢出:滚动父元素
我想显示一个表(但我使用的是div),它将滚动溢出,因为表很长。我想说的问题是,我的分区之间有一个未知的间隔 下面是一个片段:是什么导致了列(div)之间不必要的间隙Css 带空格的内联块元素之间的间隙:nowrap和溢出:滚动父元素,css,overflow,whitespace,css-tables,nowrap,Css,Overflow,Whitespace,Css Tables,Nowrap,我想显示一个表(但我使用的是div),它将滚动溢出,因为表很长。我想说的问题是,我的分区之间有一个未知的间隔 下面是一个片段:是什么导致了列(div)之间不必要的间隙 。移动交叉参考{ 边框:1px实心#2980b9; 颜色:#333; 浮动:左; 利润率:2%; 宽度:96%; } .m-grid-scroll{ 溢出-x:滚动; } .m-grid-header{ 背景色:#2980b9; 颜色:白色; 文本对齐:居中; } .m-grid-header, .m-grid-row{ 浮动:
。移动交叉参考{
边框:1px实心#2980b9;
颜色:#333;
浮动:左;
利润率:2%;
宽度:96%;
}
.m-grid-scroll{
溢出-x:滚动;
}
.m-grid-header{
背景色:#2980b9;
颜色:白色;
文本对齐:居中;
}
.m-grid-header,
.m-grid-row{
浮动:左;
宽度:100%;
}
.m-grid-header-col{
背景色:#2980b9!重要;
}
.m-grid-row-inline{
背景色:透明;
显示:内联块;
浮动:无;
空白:nowrap;
}
.m-grid-col{
右边框:1px实心#ccc;
浮动:左;
填充:1%01%1%;
}
.m-grid-col:最后一个孩子{
右边界:0;
}
.m-grid-col3{
宽度:31%;
}
.m-grid-inline{
显示:内联块;
浮动:无;
保证金:0;
}
伯恩斯
BI技术
戴尔/维希
飞利浦/Mepco
村田
松下
光谱
Mil规格
伯恩斯
BI技术
戴尔/维希
飞利浦/Mepco
村田
松下
光谱
Mil规格
有趣的是,div标记之间的空白。请参见第一列
。移动交叉参考{
边框:1px实心#2980b9;
颜色:#333;
}
.m-grid-scroll{
溢出-x:滚动;
}
.m-grid-header{
背景色:#2980b9;
颜色:白色;
文本对齐:居中;
}
.m-grid-header,
.m-grid-row{
宽度:100%;
空白:nowrap;
显示:块;
}
.m-grid-header-col{
背景色:#2980b9!重要;
}
.m-grid-row-inline{
背景色:透明;
空白:nowrap;
}
.m-grid-col{
右边框:1px实心#ccc;
填充:0px;
边际:0px;
}
.m-grid-col:最后一个孩子{
右边界:0;
}
.m-grid-col3{
宽度:31%;
}
.m-grid-inline{
显示:内联块;
保证金:0;
}
伯恩斯比科技谷/维希
飞利浦/Mepco
村田
松下
光谱
Mil规格
伯恩斯
BI技术
戴尔/维希
飞利浦/Mepco
村田
松下
光谱
Mil规格
如果有人遇到这个问题,这里有两件事要说
font-size:0
,在列本身上使用font-size:
,可以在不影响HTML的情况下解决问题。这是因为在行上将字体大小设置为0会使“隐藏字符”完全消失—它们的字体大小为0。然后应在子项中恢复字体大小,因为它(即0)是继承的这就是问题所在,隐藏的列有空格。我似乎无论如何都不能把它取下来。没错!我阅读更多信息。谢谢!:)因此,发生的情况是,例如:
LINE\u BREAK缩进textLINE\u BREAK缩进txt2LINE\u BREAK
。缩进是空白,你的浏览器也会呈现空白。我们希望我们的代码格式很好,所以我们希望有空格,这就是问题的原因。通常正确的代码格式不应该导致这个问题。尽管如此,如果您使用PHP和内嵌HTML或类似的方式呈现服务器端,那么在语言如何解释标记方面可能会有额外的警告,我对此无法置评。我通过删除HTML中的空白来解决问题,但这不是唯一的方法。关于第二部分,我同意你的看法。谢谢回复!:)