Forum has been created to help all our customers in properly working our theme. We offer complete help with configuration theme and make default look, just like on our Limuso demo. We don`t offer theme customization.

Before creating a new discussion, please:
1. Check on forum if discussion hasn`t been created before. Use the forum Search on the right.
2. Read carefully the documentation included to package.
If you didn`t find what you need and would like to post a new question click the "Start a New Discussion" button on the right.
4. You can post on forum only after registration (you need purchase code to register) .


NOTE!!! If you are starting a new topic and have got problems with your site and you want us to check what`s wrong please always give url to your site because without that we can`t check what`s wrong. Each case may be different because of your installed plugins, servers or other things.

Images Not Scaling in Responsive Breakpoints
  • Hi,
    Just finished a site development and we're trying to fix details here and there. Our client noticed that the main images do not scale properly [at all] in the breakpoint from desktop to tablet format.

    Here's a page as an example:
    http://www.tango-wave.com/products-2/power-amplifiers/dbs-band-twtas/dbs-band-750-w-peak-power-amplifiers/

    All the text in the right side column overlaps the main image on all pages. Is there a way to get all the main images to respond properly according to device size, so nothing overlaps?

    Thanks for any help!!
    Jef
  • 2 Comments sorted by
  • I found a decent solution to the problem...


    Implement these CSS properties in a different file than the HTML file, so you can have your code organized better. I added the class below to the layout.css file in the "#Respond" section:

    First, name your img tag using a "class" or "id" attribute in your HTML file:
    <img src="IMAGE LINK" border="0" class="responsive-product-image" alt="Null">

    Here's how it looks embedded in my specific page:

    <img class="alignnone wp-image-426 size-full responsive-product-image" src="http://www.my-wesite.com/wp-content/uploads/2014/07/Ku_Band_featured_ver2a.png" alt="Null" border="0" class="responsive-product-image"  width="519" height="492" />


    Then, in the CSS file [layout.css] add the changes to make it responsive:

        .responsive-product-image{
            height:auto;
            width:100%;
            max-width: 519px;    (change this size to your maximum width)
        }


    Now the images scale depending on whatever device is being used...