overlapping images

[voytek]

Hi there,
I am using "Phoca Restaurant Menu pro", it works with no problem on your default joomla templates, but i have a problem in settings of custom shape5 template (the "IMAGE MAX WIDTH" feature), the text is overlapping images, i contacted them, and this is a reply:

first:

Code: Select all

Hey,

The images aren't showing up at all in IE or Firefox or Opera for me. The only one I could get it to show up for was Chrome. Could you try disabling 3rd party styling and turning off lazy load images in the template manager to see if you can get them to display? 

The images are being generated from Phoca.

/vitoandnicks/images/phocagallery/Salads/thumbs/phoca_thumb_l_salad.jpg

Mike

and then:

Code: Select all

All max-width is doing is making sure that the image won?t get any larger than it?s surrounding div. In this case you have a div with the class pmimage that has a 1% width on it:

<div class="pmimage"><a rel="{handler: 'image', size: {x: 200, y: 150}, overlayOpacity: 0.3, classWindow: 'phocagallery-phocamenu-window', classOverlay: 'phocagallery-phocamenu-overlay'}" href="/vitoandnicks/images/phocagallery/Salads/thumbs/phoca_thumb_l_salad.jpg" title="Image Detail" class="modal-button">

<img alt="Image Detail" src="/vitoandnicks/images/phocagallery/Salads/thumbs/phoca_thumb_m_salad.jpg"></a></div>

On phocamenu.css:

 #phocamenu .pmimage, #phocamenu .pm-item table tr td div.pmimage {

 width: 1%;

}

So basically the image can?t get any wider than it?s containing div because phoca has it set to 1%. Why phoca has it set this way I have no idea.

I would send them an email to see if they can provide you a coding fix for their extension.

Mike

please look at the screenshot- (i have the description centered- if i align to the left, it overlaps more)
(inthis screenshot is "bill of fare")


is there any solution for it?

[Jan]

Hi, the one percent is set because it is stored in table and the box for image should get width which will be maximal to its width. I have tested it on hundreds of different templates without any problem. So there needs to be some part in your template which is in conflict with this setting (maybe the conflict is there because of the "responsive" feature ).

Is the template free, can I download it somewhere to test it and make possible changes to not be in conflict?.

See this:
https://www.phoca.cz/restaurantmenudemo/en/daily-menu

Do you get there the same behaviour?

I think, there is no problem to change it in the CSS, so this will be no more in conflict? Did you try to remove the 1% from the div? Did it help?

[voytek]

this is "premium template membership" template, but i sent them an e-mail if i could send it to you for testing- waiting for a reply.
I commented that 1% out (in the CSS), and now it looks like it works ok, is there anything else that changing 1% could mess?


WHAT I DID (for people who may have similar issue):
I commented out- On phocamenu.css:

#phocamenu .pmimage, #phocamenu .pm-item table tr td div.pmimage {

width: 1%;

}

[Jan]

Ok, thank you for this info.

Jan