Css 每行三个缩进文本块中的第二个未对齐

Css 每行三个缩进文本块中的第二个未对齐,css,css-float,Css,Css Float,我有以下问题(可以在这里找到钢笔:): 当我将该模式相应地应用于第二个div时: .ft-label { display:block; float:left; clear:both; } .ft-labelinfoTRY { display:block; margin-left:2.5em; text-align:left; float:left; } .ft-labelinfoTRY2 { display:block; text-align:

我有以下问题(可以在这里找到钢笔:):

当我将该模式相应地应用于第二个div时:

.ft-label {
    display:block;
    float:left;
    clear:both;
}

.ft-labelinfoTRY {
  display:block;
  margin-left:2.5em;
  text-align:left;
  float:left;
}

.ft-labelinfoTRY2 {
  display:block;
  text-align:left;
  margin-left:15em;
}

时间(
.ft-labelinfoTRY2
)已正确对齐,但日期(
.ft-labelinfoTRY
)未对齐,因为它们必须浮动,因此其左边距指的是长度不同的ft标签跨距的末端,因此它们未对齐。有没有一种方法可以在不使用网格解决方案或表格的情况下正确对齐所有元素,但要坚持我使用的模式?或者使用上述其中一种会更好吗

您必须将宽度设置为.ft标签并删除所有边距。它会像你需要的那样工作

.ft-label {
    display:block;
    float:left;
    clear:both;
}

.ft-labelinfo {
  display:block;
  margin-left:5.5em;
  text-align:left;
}
.ft-label {
    display:block;
    float:left;
    clear:both;
}

.ft-labelinfoTRY {
  display:block;
  margin-left:2.5em;
  text-align:left;
  float:left;
}

.ft-labelinfoTRY2 {
  display:block;
  text-align:left;
  margin-left:15em;
}