我想让一个字段成为必填字段,但是红色的*位于我想要的字段名称的下面,就在字段名称的旁边
下面是HTML代码
<div class="span12" id="propertytype">
{% for field1 in propertytypeform %}
<p>
<label> {{ field1.label_tag }}
{% if field1.field.required %}
<span class="required-field">*Required</span>
{% endif %}
</label>
{{ field1 }} <br />
{ field1.errors }}
</p>
{% endfor %}
</div>
CSS文件
.required-field{
color:red;
font-size:8px;
/*position:absolute;
top:-50;*/
}
发布于 2017-08-17 16:35:31
:{{ field1.label_tag }}
的呈现是由<p>
标记实现的。在超文本标记语言中,<p>
标记是一个块标记,所以它占据页面宽度的100%。因此,字段{{ field1.label_tag }}
旁边没有位置,因此它在下一行显示其余部分。
这只是一个CSS问题。
您可以做的是:
<span class="field">{{ field1.label_tag }}</span>
.field p {
width: 200px;
}
这是用于示例的,但我建议您使用<div>
来调整<p>
的宽度
发布于 2018-07-23 16:22:35
您还可以使用display:flex来获取标记内同一行中的所有内容。所以你可以使用下面的代码吗?我希望它能帮助你。
#propertytype p label {
display: flex;
}
如果您想了解有关flex属性的更多信息,请访问here
https://stackoverflow.com/questions/19631441
复制相似问题