CSS menu conflict/using standard modules

jgribble
13 years ago
Am having a problem with a CSS conflict between Mobile Joomla and my vertical menu (Offlajn). Contacted them a week ago; not one bit closer to the solution today, sadly. The conflict causes the menu background to go transparent. Where in the CSS is the most likely culprit?  Iphone template CSS? I would be happy to allow somebody to take a look. Also, can you use a custom HTML module to display content such as images in Mobile Joomla? I did this and it seemed to work, but still wonder if it's a problem. One thing I used this for was to display a compact version of the main-site header. Looked fantastic.
As far as menus, can I also use the same vertical menu module as I'm using on the main site? For consistent appearance. Again, I tried this and it seemed to work fine in desktop emulation. I created a new mobile menu, created a new vertical menu module, selected the new mobile menu in the module parameters, and set the module position to display in the iphone header 2 position. I'm thinking this might not actually work on the mobile device.
Thanks to anyone who has some thoughts,
-jgribble
dryabov
13 years ago
jgribble wrote:
Am having a problem with a CSS conflict between Mobile Joomla and my vertical menu (Offlajn). Contacted them a week ago; not one bit closer to the solution today, sadly. The conflict causes the menu background to go transparent. Where in the CSS is the most likely culprit?  Iphone template CSS? I would be happy to allow somebody to take a look.

mobile_iphone template is based on jQTouch framework that redefine style for a lot of html tags (e.g. ul lists are transformed to iphone-like menus, etc.). It's possible to override this styles, but usually it requires a lot of "!important"s and maybe some other tricks.

jgribble wrote:
Also, can you use a custom HTML module to display content such as images in Mobile Joomla? I did this and it seemed to work, but still wonder if it's a problem. One thing I used this for was to display a compact version of the main-site header. Looked fantastic.

Yes, custom HTML modules work well with MJ.
jgribble wrote:
As far as menus, can I also use the same vertical menu module as I'm using on the main site? For consistent appearance. Again, I tried this and it seemed to work fine in desktop emulation. I created a new mobile menu, created a new vertical menu module, selected the new mobile menu in the module parameters, and set the module position to display in the iphone header 2 position. I'm thinking this might not actually work on the mobile device.

You can try, but it depends on the module and on the device. The problem is that some modules use a lot of javascripts and css styles that are supported by few modern devices only (e.g. support for position:fixed was added in iOS5 only). So, test it before use on production site.
doorknob
12 years, 11 months ago
I'm having a similar problem with the framework CSS causing havok with the other content. When I looked at the theme.min.css file, the problem was obvious. The CSS statements intended to style the framework are so simplistic, they interfere everywhere. I changed 'ul' to 'ul.vmenu' and 'li' to 'ul.vmenu li' and it resolved my conflicts. No doubt a robust solution will need to consider other class name possibilities.

By continuing to use this site you consent to the use of cookies on your device as described in our cookie policy unless you have disabled them. This site will not function correctly without cookies.

I accept cookies from this site.