Html CSS对齐跨度到div的左下角对齐到右下角

我试图将

span

与

div

的左侧对齐，该div与右侧对齐（

float:right

），但

span

总是与

div

发生冲突

*{
字体系列：Lucida Sans Unicode、Lucida Grande、Verdana、Arial；
}
.mw{
显示：内联块；
浮动：对；
位置：相对位置；
}
味精{
浮动：对；
背景色：#D80000；
颜色：白色；
填充：0.66em；
边界半径：1米；
}
.uns{
位置：绝对位置；
底部：0；
}

0
一些内容

您可以使用

transform:translateX（-100%）

并将

span

向左移动，使其与宽度相等

*{
字体系列：Lucida Sans Unicode、Lucida Grande、Verdana、Arial；
}
.mw{
显示：内联块；
浮动：对；
位置：相对位置；
}
味精{
浮动：对；
背景色：#D80000；
颜色：白色；
填充：0.66em；
边界半径：1米；
}
.uns{
位置：绝对位置；
底部：0；
转化：translateX（-100%）；
}

0
一些内容

只需在类中添加left:-20px

 .uns {
        position: absolute;
        bottom: 0;
        left : -20px;
    }

---

看看这把小提琴

如果没有特殊原因使用

位置：绝对值

，则可以使用此选项

.uns {
  position: relative;
  float: left;
  padding-right: 10px;
  margin-top: 20px;
}

---

在.uns类样式中添加“左边距：-15px；”。

您可以使用

flexbox

实现这一点，并去除那些

清除的
和
浮动的
类样式

避免使用内联样式


*{
字体系列：Lucida Sans Unicode、Lucida Grande、Verdana、Arial；
}
.包裹{
宽度：480px；
背景：黄色；
填充：1米
}
.mw{
位置：相对位置；
显示器：flex；
调整内容：柔性端
}
味精{
背景色：#D80000；
颜色：白色；
填充：0.66em；
边界半径：1米；
}
跨度{
显示：内联块；
自对准：柔性端
}

100000
一些内容
我建议使用flexbox：

.mw {    
  display: flex;
  align-items: flex-end; // Align to the bottom
  // rest of the code
}

这里有一个？？回答晚了，但是
垂直对齐
，
文本对齐
+
内联块
如何启动一些
浮动
，因为它只涉及语法内容


*{
字体系列：Lucida Sans Unicode、Lucida Grande、Verdana、Arial；
}
.mw{
显示：内联块；
浮动：对；
位置：相对位置；
文本对齐：右对齐；
}
味精{
背景色：#D80000；
颜色：白色；
填充：0.66em；
边界半径：1米；
显示：内联块；
}
.uns{
垂直对齐：-1米；
显示：内联块；
}
[style]{overflow:hidden；/*在'n外部浮动中清除*/}

0
一些内容

10 000 000 00
一些内容

10000个
+它也可以包装
一些内容
这没有帮助，当的内容值较大（如10000）时，它会再次出错。正如您在这里看到的，它将始终向左对齐。这更多的是hack
：）
因为OP代码不是很好。混合
float
s和
position:absolute
Nope，如果span的内容类似于“100000”，它会再次出错（只是回答了这个问题；）