Heatherbell Posted December 6, 2015 Share Posted December 6, 2015 Hoping someone can advise? Running a bootstrap site - there is a small bottom strip missing from every image in the photogrid example here We cannot find the code responsible for this Link to comment Share on other sites More sharing options...
MrPhil Posted December 6, 2015 Share Posted December 6, 2015 The HTML calls for a 250px square image, but the CSS seems to be scaling it to 82.5px square. There is a 20px bottom margin (img-responsive class) which may be counting against the allotted height (probably against the 250px, as it doesn't look like it's taking 20px out of 82.5). Just for fun, maybe try changing the bottom margin to 0 and see if that helps. If the layout is messed up by that, we'll have to try something else. A margin shouldn't affect the image size, but who knows what's going on here. By the way, displaying as if on a smartphone (Firefox shift-ctrl-M), the left sides of images were badly cut off. That may be something else you want to look at. Link to comment Share on other sites More sharing options...
Heatherbell Posted December 6, 2015 Author Share Posted December 6, 2015 Thanks for your suggestion but bottom margin change to 0 hasn't changed anything. Sorry I am not code literate but it seems that the height of the photogrid is setting to some weird percentage. (I wanted a larger image in product info so had changed pigal to 350px which caused the chopped image in smartphone - now changed back - thanks for that) Link to comment Share on other sites More sharing options...
MrPhil Posted December 6, 2015 Share Posted December 6, 2015 I just loaded the page again, and the full images are showing (both PC display and smartphone sized). They're no longer cut off at the bottom. If you don't see that, hit Ctrl+F5 to force a full page reload, and see if it works then. Link to comment Share on other sites More sharing options...
♥Tsimi Posted December 7, 2015 Share Posted December 7, 2015 I had the same issue long time ago and joli1811 did too. No matter what margin, gutter or css definition you add it always cut the bottom part of the large image. The solution that Matt suggested was very simple. Open your ext/photoset-grid/jquery.photoset-grid.min.js file. And search for (Ctrl+f) the word overflow. Once you find it change it from overflow:"hidden" to overflow:"visible" save and close the file. Done! Link to comment Share on other sites More sharing options...
MrPhil Posted December 7, 2015 Share Posted December 7, 2015 @@Tsimi, I would consider that at best to be a temporary workaround, rather than a permanent fix. You have content being cut off because it's overflowing its designated space. Rather than simply saying, "go ahead and display the overflow no matter what it's covering up", it would be better in the long run to figure out why your content does not fit in the space you set aside for it, and adjust the layout and/or content until everything fits properly. To each his own, but that's how I would approach it. Link to comment Share on other sites More sharing options...
Heatherbell Posted December 7, 2015 Author Share Posted December 7, 2015 @@Tsimi Many thanks for your time and advice - that works. I do not understand why, if this is a general problem, it has not been fixed in the oscommerce code Link to comment Share on other sites More sharing options...
♥Tsimi Posted December 7, 2015 Share Posted December 7, 2015 @@MrPhil As to the question "why" this happens I really don't know it beats me. When I had that issue with the thumbnails covering the large image I spend many days changing all kinds of margins, paddings, widths and heights and layouts but nothing could fix it. I used all tools at my disposal and still couldn't get this fixed until I saw Johns and Matts solution with that overflow setting. The thumbnails defy all logic. For me that overflow did the trick. I'll let the creators take care of this issue since I have spend more time then I should have with this. :D Link to comment Share on other sites More sharing options...
Recommended Posts
Archived
This topic is now archived and is closed to further replies.