Align Three Images To Fill Full Width Of Div Container

Developers Frontend
1

Hi

I think I am on the right track here but not quite.

I am trying to have three separate images which I will call tiles that each represents a separate hyperlink to another section of either the store or an external link.

The tiles have all the same sizes but in place they on the outer site do not nicely align with the above banner slide.

In the custom css part of the theme editor I have added the following code:

.nested-container {
    width: 104%;
    margin-left: 0%;
}

.ty-tiles-promo__item {

display: inline-block;

margin-right: 0px;

margin-left: 0px;

padding: 1px 1px;

width: 32%;

list-style-type: none;

vertical-align: top;

text-align: left;

-webkit-box-sizing: border-box;

-moz-box-sizing: border-box;

box-sizing: border-box;

}


ul.ty-tiles-promo__list {

margin: 0;

padding: 0;

}

The three images or tiles as I call them appear to align with the bannerslide caroussel above it.

[attachment=11841:promo-tiles-2.jpg]

In Firefox it seems to work but it does not for Opera

promo-tiles-2.jpg

2

Hi

I think I am on the right track here but not quite.

I am trying to have three separate images which I will call tiles that each represents a separate hyperlink to another section of either the store or an external link.

The tiles have all the same sizes but in place they on the outer site do not nicely align with the above banner slide.

In the custom css part of the theme editor I have added the following code:

.nested-container {
    width: 104%;
    margin-left: 0%;
}

.ty-tiles-promo__item {

display: inline-block;

margin-right: 0px;

margin-left: 0px;

padding: 1px 1px;

width: 32%;

list-style-type: none;

vertical-align: top;

text-align: left;

-webkit-box-sizing: border-box;

-moz-box-sizing: border-box;

box-sizing: border-box;

}


ul.ty-tiles-promo__list {

margin: 0;

padding: 0;

}

The three images or tiles as I call them appear to align with the bannerslide caroussel above it.

attachicon.gifpromo-tiles-2.jpg

In Firefox it seems to work but it does not for Opera

Hi

try this demo site http://ez-cart.com/cs438/if it works for you.

[attachment=11842:3banners.jpg]

its a triple banner addon which is also repsonsive and you can also set the background color too.

You just add 3 banners as you do in carousel and it distributes them evenly.

If it works for you the pride 15€ and you can buy it here http://www.cscart.biz/tripple-banner.html?sl=EN

Fotis

3banners.jpg

3

Hi

try this demo site http://ez-cart.com/cs438/if it works for you.

attachicon.gif3banners.jpg

its a triple banner addon which is also repsonsive and you can also set the background color too.

You just add 3 banners as you do in carousel and it distributes them evenly.

If it works for you the pride 15€.

Let me know

Fotis

Is this yours Fotis ? where can I buy it ?

Can you do multiple blocks like these and does this work as a block addon ??

4

Is this yours Fotis ? where can I buy it ?

Can you do multiple blocks like these and does this work as a block addon ??

Hi Anthony,

forgot the link for the addon

http://www.cscart.biz/tripple-banner.html?sl=EN

PS

also added in the original reply.

yes you can add as many as you like. It is a block like the slideshow carousel block, so you can also set class and wrapper too.

Fotis