Html 新闻标题不能正常滚动

我做了一个新闻标题栏目。新闻从左到右流畅地传播。唯一的问题是我的新闻文本是块类型。每个字都叠在一起。如何解决这个问题

#新闻空间{
溢出：隐藏；
宽度：400px；
边框：1px纯黑；
高度：30px；
}
#新闻标题{
左：100%；
动画名称：新闻滚动；
动画持续时间：10秒；
动画计时功能：线性；
动画迭代次数：无限；
}
@关键帧新闻滚动{
来自{transform:translate（0,0）}
到{transform:translate（-100%，0）}
}

今天大减价
 今天大减价

删除

左侧填充

，添加

显示：内联块

和一些

width

到

标记，并将动画

从{transform:translate（100%，0）}

更改

请记住，两个

都必须适合父元素，否则第二个

将跳转到下一行

#新闻空间{
溢出：隐藏；
宽度：400px；
边框：1px纯黑；
高度：30px；
}
#新闻标题{
动画名称：新闻滚动；
动画持续时间：10秒；
动画计时功能：线性；
动画迭代次数：无限；
}
#新闻标题{
利润率：6px；
宽度：150px；
显示：内联块；
}
@关键帧新闻滚动{
来自{transform:translate（100%，0）}
到{transform:translate（-100%，0）}
}

今天大减价

今天大减价