News:

Looking for documentation? Take a look on our wiki

Main Menu

Product picture floats around page.

Started by dwhitaker, November 26, 2012, 16:04:16 PM

Previous topic - Next topic

dwhitaker

I have created a product, but when I view my shop, the picture for the item is not near the description of the item. 

How can I prevent this from happening?

http://173.254.28.40/~sportfam/home/index.php/shop

bytelord

#1
Hello,

You are using a third party joomla template and perhaps vm template that uses bootstrap library which is overlap the styling for for modal. Inside bootstrap.min.css around line 754 you have

.modal {
    background-clip: padding-box;
    background-color: #b9298b;
    border: 1px solid rgba(0, 0, 0, 0.3);
    border-radius: 6px 6px 6px 6px;
    box-shadow: 0 3px 7px rgba(0, 0, 0, 0.3);
    left: 50%;
    margin: -250px 0 0 -280px;
    overflow: auto;
    position: fixed;
    top: 50%;
    width: 560px;
    z-index: 1050;
}

If you disable some CSS attributes will become:

.modal {
    background-clip: padding-box;
    background-color: #b9298b;
    border: 1px solid rgba(0, 0, 0, 0.3);
    border-radius: 6px 6px 6px 6px;
    box-shadow: 0 3px 7px rgba(0, 0, 0, 0.3);
    overflow: auto;
    width: 560px;
    z-index: 1050;
}

Then will works, so please create some overrides to fix that issues that related to bootstrap framework

Use firebug to examine you site code, styling and also for js conflicts: http://forum.virtuemart.net/index.php?topic=102850.0

Also you could take a look how to create or edit your template overrides:

Creating Template overrides: https://forum.virtuemart.net/index.php?topic=98505.0
Template System: https://dev.virtuemart.net/projects/virtuemart/wiki/Hints_for_the_use_of_the_template_system


Regards
Production: Joomla 2.5.8 | VM 2.0.14 | PHP 5.3.13
Testing     : Joomla 2.5.8 | VM 2.0.16 | PHP 5.3.8
Testing     : Joomla 2.5.8 |    VM 2.1   | PHP 5.3.8

- Don't Forget to mark thread as solved when it is solved!
- Please do not PM with support questions, use the forum!

dwhitaker

I see that the bootstrap.min.css is from my template i am using for joomla.  Im only slightly familiar with overrides, and I have looked over the documentation you provided, where do I put my modified bootstrap.min.css file so only VM will reference it?  I want to make sure the override does not effect the core template.

bytelord

#3
Hello,

modal css is a joomla 2.5 system core file not virtuemart. please take a look on that post from joomla forum: http://ux.joomla.org/forum/User-Research/662-Bootstrap-and-Joomla-156725---a-common-solution-needed
They suggest to change the .modal from bootstrap to div.modal ...
Otherwise you could create or edit your template overrides and use another function out of modal or create a new one for your vm2

Regards
Production: Joomla 2.5.8 | VM 2.0.14 | PHP 5.3.13
Testing     : Joomla 2.5.8 | VM 2.0.16 | PHP 5.3.8
Testing     : Joomla 2.5.8 |    VM 2.1   | PHP 5.3.8

- Don't Forget to mark thread as solved when it is solved!
- Please do not PM with support questions, use the forum!

dwhitaker

I think that solved it for me, thank you very much

bytelord

Production: Joomla 2.5.8 | VM 2.0.14 | PHP 5.3.13
Testing     : Joomla 2.5.8 | VM 2.0.16 | PHP 5.3.8
Testing     : Joomla 2.5.8 |    VM 2.1   | PHP 5.3.8

- Don't Forget to mark thread as solved when it is solved!
- Please do not PM with support questions, use the forum!