HI
I am trying to displaying images fields via Acf and flexbox.
The link below works on my webpage with html and css. However, when images are dynamic (acf) the images with flexbox just align in one column.
(flexbox original source: http://codepen.io/mazil/pen/ZbxBLa
1. I added the flexbox example (http://codepen.io/mazil/pen/ZbxBLa
) to my web page successfully and flexbox worked displaying images left to right in grid formation.
2. Then i tried to add my custom image fields ‘profile_picture’ – The outcome was that images had containers but the flexbox displayed each item/image in one column? I can see the gallery css has ‘display: flex;’ but it’s broken?
<div class="container">
<?php
$args = array(
'post_type' =>'artist',);
$query = new WP_Query( $args ); ?>
<?php if ( $query->have_posts()) : while ( $query->have_posts() ) : $query->the_post(); ?>
<?php
$attachment_id = get_field('profile_picture');
$size = "medium"; // (thumbnail, medium, large, full or custom size)
$image = wp_get_attachment_image_src( $attachment_id, $size );
if ( $image ) { ?>
<div class="gallery">
<div class="gallery--item"><a href="<?php the_permalink(); ?>" title="<?php the_title(); ?>">
<img class="gallery--image" alt="Image of <?php the_title(); ?>" src="<?php echo $image[0]; ?>" />
</a>
</div>
</div>
<?php } ?>
<?php endwhile; ?><?else: ?>
<?endif; ?>
</div>
This reply has been marked as private.
This reply has been marked as private.
Hi @m-werner ,
I have responded to your issue from the email support.
The issue is related to the markup generated by the loop.
The loop is wrapping each image inside its own flex container.
I hope this helps.
This reply has been marked as private.
Thanks James all working now:)
