[英]Two Column Repeater Field Advanced Custom Fields
I am new to ACF and want to use a repeater field to create a two column row. 我是ACF的新手,想要使用转发器字段来创建一个双列行。 It is functioning how I want (two even, halved columns).
它是我想要的功能(两个偶数,减半的列)。 I want each column to begin at the same height as the other, therefor I set the height.
我希望每列都以与另一列相同的高度开始,因此我设置了高度。 But I want to ensure I am using best practices... is how I wrote this the way you would recommend going about it?
但我想确保我使用的是最佳实践......我是按照你推荐的方式编写的吗? I feel like there is probably a better way.
我觉得可能有更好的方法。
Thank you in advance. 先感谢您。
PHP PHP
<div class="bg-white">
<div class="dib mw9 center">
<?php
if( have_rows('faq') ):
while ( have_rows('faq') ) : the_row(); ?>
<div class="parent">
<h4><?php the_sub_field('question'); ?></h4>
<p><?php the_sub_field('question_answer'); ?></p>
</div>
<?php endwhile;
else :
endif;
?>
</div>
</div>
CSS CSS
.parent {
display: inline-block;
height: 240px;
width: 50%;
float: left;
padding: 48px 24px;
}
if you're able to add an additional class to the wrapping div (class="dib …"), lets call it '.parent-wrapper', you could simply use following code: 如果你能够在包装div中添加一个额外的类(class =“dib ...”),我们称之为'.parent-wrapper',你可以简单地使用下面的代码:
.parent-wrapper {
display: flex;
flex-wrap: wrap;
}
.parent {
flex: 50%;
padding: 48px 24px;
}
No need for height, as flex takes care of it. 不需要高度,因为flex会照顾它。 Here you're independent from the content length.
在这里,您独立于内容长度。 So even very long answers would be formatted correctly.
因此即使非常长的答案也会正确格式化。
I hope that helps :) 我希望有帮助:)
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.