
Hi All,
I am trying to create a events grid using repeater fields that contain mostly text boxes and am having issues with the content showing up columns rather than rows. Below is an example of what I want to achieve and the php/css code.
Thanks
<?php
// check if the repeater field has rows of data
if( have_rows(‘new_event’) ):
// loop through the rows of data
while ( have_rows(‘new_event’) ) : the_row();
?>
<div style=”background-color:<?php the_sub_field(‘box_background_color’); ?>” class=”careers-events-box”>
<h2 class=”events-title”><?php the_sub_field(‘events_title’); ?></h2>
<p>Date:</p><p><?php the_sub_field(‘events_date’); ?></p>
<p class=”events-title-text”>Time: </p> <p><?php the_sub_field(‘events_time’); ?></p>
<p class=”events-title-text”>Location: </p> <p><?php the_sub_field(‘events_location’) ?></p>
<p class=”events-title-text”>Details: </p> <p><?php the_sub_field(‘events_details’) ?> </p>
</div>
.careers-events-box {
width: 300px;
height:300px;
border-bottom-color:red;
border-bottom-style: solid;
display: flex;
}
.careers-events-box h2 {
color:white;
text-align: left;
padding-left:5px;
margin:0px;
}
.careers-events-box p {
color:white;
text-align: left;
padding-left:5px;
}
I have sorted this… just removed “display: flex;”