How to use Flexboxes on my unusual lightbox gallery that doesnt work also (laterally offset)??

Question

Im trying to get my Gallery part on my Homepage to look like this: Thats the Design in Photoshop

So I dont know how the image in the middle to float with the other ones. Hopefully that make sense.

Here is my Code of the Gallery:

<div class="Portfolio">
                
                <div class="MeineNo2">
          <div>MEINE</div>
          </div><!--MeineNo2-->
                
                <div class="Werke">
          <div>WERKE</div>
          </div><!--Werke-->
                
                <div class="TrennungNo4">
                <img src="Images/Strich_320.jpg" alt="" />
                </div><!--TrennungNo4-->
        
          <div class="UnterschriftNo4">
          <div>DAS SIND MEINE BESTEN PROJEKTE</div>
           </div><!--UnterschriftNo4-->
                
                <div class="Gallery">
                <a class="example-image-link" href="Images/1_1.jpg" data-lightbox="example-1"><img class="example-image" src="Images/1.png" alt="image-1" /></a>
                <a class="example-image-link" href="Images/1_1.jpg" data-lightbox="example-1"><img class="example-image" src="Images/1.png" alt="image-1" /></a>
                <a class="example-image-link" href="Images/1_1.jpg" data-lightbox="example-1"><img class="example-image" src="Images/1.png" alt="image-1" /></a>
                <a class="example-image-link" href="Images/1_1.jpg" data-lightbox="example-1"><img class="example-image" src="Images/1.png" alt="image-1" /></a>
                <a class="example-image-link" href="Images/1_1.jpg" data-lightbox="example-1"><img class="example-image" src="Images/1.png" alt="image-1" /></a>
                <a class="example-image-link" href="Images/1_1.jpg" data-lightbox="example-1"><img class="example-image" src="Images/1.png" alt="image-1" /></a>
                </div>                
            
</div><!--Portfolio-->

Can we see your CSS ? Also you can use hosted images so we can see them. — Relisora, Aug 05 '16 at 12:15
Flexbox is not going to help here...you'll need positioning. — Paulie_D, Aug 05 '16 at 12:17
@Paulie_D I thought with flexboxes I can make this floatable for a few displays — Constantin Finkbeiner, Aug 05 '16 at 12:19
There's no floating with flexbox and it's not a magic layout method. It still works in distinct rows and columns. — Paulie_D, Aug 05 '16 at 12:22
It's a not uncommon design so some additional searching...but positioning will be involved...and probablty some JS — Paulie_D, Aug 05 '16 at 12:40

How to use Flexboxes on my unusual lightbox gallery that doesnt work also (laterally offset)??

0 Answers0