html一行中怎么写空格,html – 用一行填写空格

如何创建一个下划线,填充文本行末尾和DIV宽度结束之间的空白区域.

我正在尝试以下方法：

我希望当屏幕变小时,产品线会中断.我希望价格保持在右边,并加下划线.最后一个单词(Mayo)和价格之间的空格必须自动填充下划线.

大屏幕：

老奶酪 – 沙拉,牛油果,鸡蛋,草药梅奥…………………. 500

较小的屏幕：

老奶酪 – 沙拉,牛油果,鸡蛋,

草药梅奥…………………………………… 500

超小屏幕：

老奶酪 – 沙拉,鳄梨,

鸡蛋,草药梅奥……………………… 500

我有以下标记：

Old Cheese – Salad, Avocado, Egg, Herbal Mayo

&nbsp

500

CSS

.productline {

width:300px;

}

.product {

display:table-cell;

white-space: nowrap;

}

.line {

border-bottom: 1px solid black;

display: table-cell;

width:100%;

}

.price {

border-bottom:1px solid black;

display: table-cell;

white-space: nowrap;

vertical-align:bottom;

}

例

固定