Images in blog style section in rows

hi. I’m still struggling a bit getting the hang of some layouts. I have a portfolio site and would like to arrange the images so that sometimes the images are displayed next to each other and smaller (but the same total width as the larger single images) and sometimes the images are just single images with full width. How would i introduce this layout to the images?

Here is the site I’m working on http://paulpreissner.com

Can you make a quick visual example of what you are trying to achieve?

yes… i think in some projects i would want it to be single image like it currently is, and other projects i would like it to be two columns for the images… i only recently signed up and it wont let me upload and image yet.

For two columns, you give the li elements a width of 50% and float them:

.project_images li {
  width:50%;
  float:left;
}

You have to give the container a separate class if you don’t want this layout for all li elements on the page that live within a project_images container on the page.

BTW you can upload an image to a platform like imgur.com and link to it here.

thanks. ill give this a try.

where in my project snippet code would i put this bit?

<main class="projects" role="main">
    <?php $projects = page('projects')->children()->visible(); ?>
    <?php foreach ($projects as $project) : ?>
        <section id="projects">
            <div class="project">
                <div class="project_description">
                    <span class="title"><?php echo $project->title()->html() ?></span>
                    <p class="description"><?php echo $project->text()->html() ?></p>
                    <p class="caption"><?php echo $project->links()->kirbytext() ?></p>
                </div>
                <?php if($project->hasImages()): ?>      
                    <div class="project_images">
                        <ul>
                        <?php foreach($project->images() as $image): ?>
                            <li><img class="lazy" src="assets/images/x.svg" data-original="<?php echo $image->url() ?>" width="88%" height="auto" alt="" /></li>
                        <?php endforeach ?>
                           </ul>        
                    </div>
                <?php endif ?> 
            </div>
        </section>
    <?php endforeach ?>
  </main>

It doesn’t go into the template but into your css stylesheet …

ah… duh. thanks! i wasnt thinking straight.