b.designer Posted April 1, 2013 Share Posted April 1, 2013 Hi. In the categories pages there are images that don't show. I am not a programmer so I am not sure where I need to go in order to fix this issue. Somebody said to me it is something to do with badly overlay applied, and that it needs to be absolutely positioned, like top:0, left:0; position:absolute. The problem is: Where would I have to go to edit this? http://www.tissu.com...roller=category (see the 5th, 8th, 15th and 16th images are missing) Link to comment Share on other sites More sharing options...
NemoPS Posted April 1, 2013 Share Posted April 1, 2013 Hey there! I assume you're referring to me :) Product_list.css, add this .overlay { position:absolute; left:0; top:0 } Change your "id" property to class in the html, of course, since IDs should be unique in the page! It should solve it! Oh and be sure to remove the hardcoded negative margine on the overlay images. Cheers B.! Link to comment Share on other sites More sharing options...
b.designer Posted April 1, 2013 Author Share Posted April 1, 2013 On 4/1/2013 at 7:58 PM, Nemo1 said: Hey there! I assume you're referring to me :) Product_list.css, add this .overlay { position:absolute; left:0; top:0 } Change your "id" property to class in the html, of course, since IDs should be unique in the page! It should solve it! Oh and be sure to remove the hardcoded negative margine on the overlay images. Cheers B.! Man, you are everywhere! So, I easily added the code to product_list.css. I am wondering now if the class thing should be put on the product-list.tpl? Link to comment Share on other sites More sharing options...
vekia Posted April 1, 2013 Share Posted April 1, 2013 the pictures aren't missing, everything is okay, all because the different sizes of product pictures, take a look: i changed height of first image which was different that other images, now product list looks ok... so, the problem is with image height, you should change it in product-list.tpl file, or regenerate thumbnails regards Link to comment Share on other sites More sharing options...
NemoPS Posted April 2, 2013 Share Posted April 2, 2013 (edited) True it fixes that way, but product pictures can't be of different sizes randomly It also fixes if you remove the negative margin applied to the overlay image In any case, yes, change the id to class in product-list.tpl Edited April 2, 2013 by Nemo1 (see edit history) Link to comment Share on other sites More sharing options...
b.designer Posted April 2, 2013 Author Share Posted April 2, 2013 On 4/2/2013 at 7:48 AM, Nemo1 said: True it fixes that way, but product pictures can't be of different sizes randomly It also fixes if you remove the negative margin applied to the overlay image In any case, yes, change the id to class in product-list.tpl On 4/1/2013 at 11:47 PM, vekia said: the pictures aren't missing, everything is okay, all because the different sizes of product pictures, take a look: i changed height of first image which was different that other images, now product list looks ok... so, the problem is with image height, you should change it in product-list.tpl file, or regenerate thumbnails regards hey. i realized that whats causing this issue is the code inserted to apply the overlaid image "out of stock" (esgotado in portuguese). this is the code: {if $product.quantity > 0}{else}<img src="{$img_dir}esgotado.png" id="overlay" style="margin-top:-150px;" />{/if} so nemo, is the solution still the same? tks. Link to comment Share on other sites More sharing options...
NemoPS Posted April 2, 2013 Share Posted April 2, 2013 Yes, indeed, again be sure to change that id="overlay" to class="overlay" Link to comment Share on other sites More sharing options...
b.designer Posted April 2, 2013 Author Share Posted April 2, 2013 On 4/2/2013 at 1:17 PM, Nemo1 said: Yes, indeed, again be sure to change that id="overlay" to class="overlay" Nemo, tks for helping. I added the code to the css file, and changed the following: {if $product.quantity > 0}{else}<img src="{$img_dir}esgotado.png" class="overlay" />{/if} It seems to have solved the issue. Me is happy! Link to comment Share on other sites More sharing options...
NemoPS Posted April 2, 2013 Share Posted April 2, 2013 I was sure of it buha-ha-ha Link to comment Share on other sites More sharing options...
Recommended Posts