Alignment on image box

IamLLIIME
Trailblazer
159 1 33

Good day! Can you help me to fix this issue? When I'm adding another image box it always

Click to expand...
align
Click to expand...
Here is the code that I used


<style>
.row {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
}
.wrapper {
max-width: 1600px;
margin-bottom: 15% !important;
}
div.gallery {
margin: 25.5px;
border: 3px solid #aaa;
float: inherit;
width: 330px;
height: 400px
}

div.gallery:hover {
border: 2.9px solid #777;
}

div.gallery img {
width: 850%;
height: 800;
}

div.desc {
padding: 0px;
text-align: center;
}
</style>
<body>

<div class="row justify-content-center" >
<div class="gallery">
<a target="_blank" href="https://cdn.shopify.com/s/files/1/0427/7302/0824/files/edit8.png?v=1613351742">
<img src="https://cdn.shopify.com/s/files/1/0427/7302/0824/files/edit8.png?v=1613351742" alt="UPS" width="600" height="400">
</a>

</div>


<div class="gallery">
<a target="_blank" href="https://cdn.shopify.com/s/files/1/0427/7302/0824/files/edit5.png?v=1613351739">
<img src="https://cdn.shopify.com/s/files/1/0427/7302/0824/files/edit5.png?v=1613351739" alt="SPEEDGATES" width="600" height="400">
</a>
</div>


<div class="gallery">
<a target="_blank" href="https://cdn.shopify.com/s/files/1/0427/7302/0824/files/edit7.png?v=1613351736">
<img src="https://cdn.shopify.com/s/files/1/0427/7302/0824/files/edit7.png?v=1613351736" alt="CABLES" width="600" height="400">
</a>
</div>


<div class="gallery">
<a target="_blank" href="https://cdn.shopify.com/s/files/1/0427/7302/0824/files/edit2.png?v=1613351737">
<img src="https://cdn.shopify.com/s/files/1/0427/7302/0824/files/edit2.png?v=1613351737" alt="CABLES" width="600" height="400">
</a>
</div>

</div>
</body>

 

 

 

<style>
.row {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
}
.wrapper {
max-width: 1600px;
margin-bottom: 15% !important;
}
div.gallery {
margin: 25.5px;
border: 3px solid #aaa;
float: none;
width: 330px;
height: 400px
}

div.gallery:hover {
border: 2.9px solid #777;
}

div.gallery img {
width: 850%;
height: 800;
}

div.desc {
padding: 0px;
text-align: center;
}
</style>

<body>

<div class="row justify-content-center">
<div class="gallery">
<a target="_blank" href="https://cdn.shopify.com/s/files/1/0427/7302/0824/files/edit1.png?v=1613351735">
<img src="https://cdn.shopify.com/s/files/1/0427/7302/0824/files/edit1.png?v=1613351735" alt="" width="600" height="400">
</a>
</div>


<div class="gallery">
<a target="_blank" href="https://cdn.shopify.com/s/files/1/0427/7302/0824/files/edit4.png?v=1613351734">
<img src="https://cdn.shopify.com/s/files/1/0427/7302/0824/files/edit4.png?v=1613351734" alt="" width="600" height="400">
</a>
</div>

<div class="gallery">
<a target="_blank" href="https://cdn.shopify.com/s/files/1/0427/7302/0824/files/edit3.png?v=1613351739">
<img src="https://cdn.shopify.com/s/files/1/0427/7302/0824/files/edit3.png?v=1613351739" alt="" width="600" height="400">
</a>
</div>

<div class="gallery">
<a target="_blank" href="https://cdn.shopify.com/s/files/1/0427/7302/0824/files/edit6.png?v=1613351733">
<img src="https://cdn.shopify.com/s/files/1/0427/7302/0824/files/edit6.png?v=1613351733" alt="" width="600" height="400">
</a>
</div>

<div class="gallery">
<a target="_blank" href="https://cdn.shopify.com/s/files/1/0427/7302/0824/files/edit6.png?v=1613351733">
<img src="https://cdn.shopify.com/s/files/1/0427/7302/0824/files/edit6.png?v=1613351733" alt="" width="600" height="400">
</a>
</div>


</div>
</body>

centersample imagesample image

0 Likes
paramSoft
Shopify Partner
1444 235 643

Please provide website url and if your store is password protected then also provide password

Want to customize Shopify storefront? Check the PageFly app
75,000+ Active Shopify merchants. TOP5 best Shopify Apps.

Contact Me On : parambabla.soft@gmail.com
IamLLIIME
Trailblazer
159 1 33

@paramSoft  I already added you as a staff, the theme that I was referring was "Copy of OriginalLayout" under section --> service-template.liquid. Please let me know if your already done with it, thank you so much!

0 Likes
paramSoft
Shopify Partner
1444 235 643

Please provide website URL.

Want to customize Shopify storefront? Check the PageFly app
75,000+ Active Shopify merchants. TOP5 best Shopify Apps.

Contact Me On : parambabla.soft@gmail.com
paramSoft
Shopify Partner
1444 235 643

On which page on website?

Want to customize Shopify storefront? Check the PageFly app
75,000+ Active Shopify merchants. TOP5 best Shopify Apps.

Contact Me On : parambabla.soft@gmail.com
IamLLIIME
Trailblazer
159 1 33

The theme is currently not yet published, it was name "Copy of OriginalLayout" Under theme-> edit codes-> sections-> service.template.liquid @paramSoft   https://faxcable.com.ph/pages/repairs-and-maintenance

0 Likes
paramSoft
Shopify Partner
1444 235 643

Please check now.

Want to customize Shopify storefront? Check the PageFly app
75,000+ Active Shopify merchants. TOP5 best Shopify Apps.

Contact Me On : parambabla.soft@gmail.com
IamLLIIME
Trailblazer
159 1 33

Its still the same @paramSoft   when i;m adding another image box it appears on the center

IamLLIIME_0-1613477153359.png

This is the image that I addedThis is the image that I added

 

 

0 Likes
paramSoft
Shopify Partner
1444 235 643

Ok Now?

Want to customize Shopify storefront? Check the PageFly app
75,000+ Active Shopify merchants. TOP5 best Shopify Apps.

Contact Me On : parambabla.soft@gmail.com
IamLLIIME
Trailblazer
159 1 33

@paramSoft  still the same, btw the theme that I'am referring was "Copy of OriginaLayout"

 

0 Likes