css - 如何消除两个并排的 asp.net 标签控件之间的差距？

Question

我使用两个 ASP.net 标签控件构建了一个进度条。左边的标签有绿色背景，右边的标签有红色背景。它们的总长度为 100px。因此，如果您的进度为 75%，则绿色标签的长度为 75 像素，红色标签的长度为 25 像素。

但是两个控件之间有一个可见的间隙，如下所示:

GGGGGGG RRR

我希望它看起来像这样:

GGGGGGGRRR

假设“G”= 绿色，“R”= 红色。

我试过使用 css 但它没有用:

.pbar {
  padding: 0px 0px 0px 0px;
  margin: 0px 0px 0px 0px;
  border: none;
}

Answer 1

假设您有两个标签:

<label class='green'>GGGGGGGGGG</label>
<label class='red'>RRRRRRRRRR</label>

以下 css 将具有您正在寻找的效果:

label {
  float: left;
  margin: 0;
  padding: 0;
}
.green{
  background-color:green;
}
.red{
  background-color:red;
}

工作 fiddle :https://jsfiddle.net/bz1znu4v/2/