Можно ли поддерживать ширину диапазона как-то, если он пуст?
У меня есть следующая псевдо-таблица HTML:
<p><span class="col1">Day:</span><span class="col2"><?php echo somephp ?></span></p>
<p><span class="col1">Time:</span><span class="col2"><?php echo somephp ?></span></p>
<p><span class="col1">Class:</span><span class="col2"><?php echo somephp ?></span></p>
<p><span class="col1">Teacher:</span><span class="col2"><?php echo somephp ?></span></p>
С CSS:
span.col1 {width: 100px;float: left;}
span.col2 {width: 100px;}
Иногда PHP, который повторяется в col2, пуст, и когда это происходит, ширина col2 равна 0 и col1 в нижеследующем абзаце, она заканчивается в столбце выше рядом с col1.
Пролисты col2 игнорируют ширину, потому что они являются встроенными элементами. Вам нужно сделать их встроенными блочными элементами.
span.col2 { width: 100px; display: inline-block }
Также имейте в виду, что вам может потребоваться добавить к нему высоту в зависимости от того, где она отображается, или вы получите ширину в 100 пикселей, но высоту 0px.
По умолчанию элемент span является встроенным элементом и игнорирует ширину.
Попробуйте добавить отображение: блокируйте свои промежутки.
span.col1 {width: 100px;float: left; display:block;}
span.col2 {width: 100px; display:block;}
Надеюсь, что это поможет.
По умолчанию span отображается как встроенный.
Итак, добавьте display:block, чтобы дать ему блок-элемент, или дополнительно вы можете использовать display:inline-block, чтобы он был встроен с остальной частью текста (без использования float).