Menu icon Foundation
No Image Resize

Hi Everyone. Hammed emailed us a question about ads. Let's help him out.

--

we are adding Ads in our site, and Ads have fixed sizes in pixel and are not allowed to be responsive. and Advertisers in the arab market require this.

do you have any solution for this ?

for our new section baby.webteb.com, we took foundation, but replaced the Grid with a fixed one based on 960gs customized with a second mobile version for 960gs.
but this is not as good as the Grid from foundation.

so in order for us to have Ads in our website, we need fixed sizes on large and medium screens for the columns like having a fixed width for a media query width range, (on mobile it can be fluid like it is now) or another solution..

if you have any tips or insights on how to best implement this, please advice.

resizefixedimageResponsiveSize

Hi Everyone. Hammed emailed us a question about ads. Let's help him out.

--

we are adding Ads in our site, and Ads have fixed sizes in pixel and are not allowed to be responsive. and Advertisers in the arab market require this.

do you have any solution for this ?

for our new section baby.webteb.com, we took foundation, but replaced the Grid with a fixed one based on 960gs customized with a second mobile version for 960gs.
but this is not as good as the Grid from foundation.

so in order for us to have Ads in our website, we need fixed sizes on large and medium screens for the columns like having a fixed width for a media query width range, (on mobile it can be fluid like it is now) or another solution..

if you have any tips or insights on how to best implement this, please advice.

Rafi Benkual over 5 years ago

You can do this by:

Defining a class for the img tag: img.no-resize { max-width: none; }

Then attach max-width: none; it'll eliminate that behavior for that image.

Thomas Smith over 5 years ago

I really like your neat website design! If you want to resize images, try this to set a user-defined resizing and resolution, etc: http://www.yiigo.com/guides/vbnet/how-to-resize-image.shtml

Wing-Hou Chan over 5 years ago

Hey Rafi!

Here is another thread in which I posted a solution: http://foundation.zurb.com/forum/posts/2862-adsense-and-others-ads-with-grid--how-to-implement

There are a few CodePen demos as well for different layouts.

Chestertonpdf over 5 years ago

in order to display the Ads or any image file correctly, you will need to set and fix sizes on large and medium screens for the columns like having a fixed width for a media query width range by implmenting a document or image resizing and or scaling plugins, and set the image resizing tool to automatically resize the loaded Ads to the best viewing effect.

Image resizing plugin: http://www.rasteredge.com/how-to/vb-net-imaging/resize-image/

Image scaling tool: http://www.rasteredge.com/how-to/vb-net-imaging/scale-image/