左对齐和右对齐CSS中的一个元素内容

Question

我在inspect上有一个HTML代码（如下所示），其中我想在CSS中左对齐和右对齐时间元素内容。

HTML代码（检查时）：

<time datetime="00:15 02-08-2019" style="width:194px;" 
data-timezone="et">August 2 &nbsp;  &nbsp; 00:15</time>

上面的检查是从以下php代码生成的：

邮递区号：

<time style="width:194px;" datetime="<?php echo esc_attr(date_format($ts, 'H:i d-m-Y')) 
?>"data-timezone="<?php echo esc_attr($tz_param) ?>"><?php 
echo ucfirst(date_i18n( 'j F &\nb\sp; &\nb\sp; H:i', 
$ts->getTimeStamp()-(60*60*4))); ?></time>`

上面的检查html代码属于以下屏幕截图：

问题陈述：

我想知道我需要添加什么CSS代码，以便可以左对齐August 2（已经存在）和右对齐00:15。

Answer 1

新答案

根据您的新更新，并且由于您可以控制PHP代码，因此您可以像下面这样简单地分割日期：

<time style="width:194px;" datetime="<?php echo esc_attr(date_format($ts, 'H:i d-m-Y')) 
?>"data-timezone="<?php echo esc_attr($tz_param) ?>"><?php 
echo ucfirst(date_i18n( 'j F', 
$ts->getTimeStamp()-(60*60*4))).'<span>'.date_i18n( 'H:i', 
$ts->getTimeStamp()-(60*60*4)).'</span>'; ?></time>`

这将产生以下输出：

<time style="width:194px;" datetime="<?php echo esc_attr(date_format($ts, 'H:i d-m-Y')) 
?>"data-timezone="<?php echo esc_attr($tz_param) ?>"><?php 
echo ucfirst(date_i18n( 'j F', 
$ts->getTimeStamp()-(60*60*4))).'<span>'.date_i18n( 'H:i', 
$ts->getTimeStamp()-(60*60*4)).'</span>'; ?></time>`

time {
 display:inline-block;
}
time span {
  float:right;
}

旧答案

您可以使用模拟它，word-spacing但是您需要在之间插入一个特殊的空间august，2称为固定宽度空间，该空间不会受到word-spacing

<time datetime="00:15 02-08-2019" style="width:194px;" data-timezone="et">August 2<span>00:15</span></time>

time {
 border:1px solid;
 display:block;
 width:300px;
 word-spacing:190px;
}

字距算法取决于用户代理。字间距也受对齐方式影响（请参见“文本对齐”属性）。字间距会影响每个空格（U + 0020）和不间断空格（U + 00A0），这些空格在应用了空白处理规则后留在文本中。该属性对其他单词分隔符的影响是不确定的。但是，一般标点符号，前进宽度为零的字符（例如，零个U + 200B）和固定宽度的空格（例如U + 3000和U + 2000至U + 200A）不受影响。 ^参考

空格列表：http : //jkorpela.fi/chars/spaces.html