[Skip to main content](#vessel-content)

#   Responsive Comparison Tool

##

- **[teamtmedia](/forum/user/39167-teamtmedia "View teamtmedia's Profile")**
- [![teamtmedia's Avatar](https://www.hikashop.com/media/kunena/avatars/resized/size144/users/avatar39167.png)](/forum/user/39167-teamtmedia "View teamtmedia's Profile") Topic Author
- [ Offline](/forum/user/39167-teamtmedia)

Less More

- Posts: 38
- Thank you received: 0
-
-
-
-

10 years 8 months ago [\#229497](#229497) by [teamtmedia](/forum/user/39167-teamtmedia "View teamtmedia's Profile")  *[Responsive Comparison Tool](/forum/50-feature-request/882214-responsive-comparison-tool#229497 "-- url of the page with the problem -- : localhost -- HikaShop version -- : 2.6.1 -- Joomla version -- : 3.4.8 -- PHP version -- : 5.6.8 -- Browser(s) name and version -- : FF44  I recognise that, to a degree, this is down to the designer/developer. However there is, perhaps, a simple suggestion that could be implemented to help people realise the comparison tool down to lower resolutions with more simplicity. Being that the use of a comparison tool is seeing the information on a variety of products in a &quot;side by side&quot; layout it does mean that below certain resolutions your &quot;maximum permitted&quot; products for comparison stops the tool being useful.  As an example I have the configuration set for 3 as my usable width per product in listing is about 300px (not too uncommon). So my choice of 3 is fairly logical as this allows me to have 3 products side by side with a row header column.  What might be a more &quot;usable&quot; option could be to define the column width and have the browser calculate the number of comparable products based off browser width. As an example:  A visitor is using a 1920 screen with browser at full width (1866px for argument's sake). This allows for 5 products and the row header column.  Visitor 2 is using an HTC One Mini in landscape giving a browser width of 1280px. This would, therefore, allow for 3 products and the row header column.  With a definable row header column width this calculation could be further refined.  Visitor 3 is using an iPhone 4 in landscape giving a browser width of 960px. This would allow for 2 products.  Anything that would only provide space for 1 product would automatically disable the comparison tool.  As I say I have styled this myself but have had to disable the comparison tool below 900px (that is the smallest I can style the 3 product limit I have chosen). With the calculations being handled by the browser this could really provide a neat additional to your comparison tool.")* was created by *[teamtmedia](/forum/user/39167-teamtmedia "View teamtmedia's Profile")*

-- url of the page with the problem -- : localhost
-- HikaShop version -- : 2.6.1
-- Joomla version -- : 3.4.8
-- PHP version -- : 5.6.8
-- Browser(s) name and version -- : FF44

I recognise that, to a degree, this is down to the designer/developer. However there is, perhaps, a simple suggestion that could be implemented to help people realise the comparison tool down to lower resolutions with more simplicity. Being that the use of a comparison tool is seeing the information on a variety of products in a "side by side" layout it does mean that below certain resolutions your "maximum permitted" products for comparison stops the tool being useful.

As an example I have the configuration set for 3 as my usable width per product in listing is about 300px (not too uncommon). So my choice of 3 is fairly logical as this allows me to have 3 products side by side with a row header column.

What might be a more "usable" option could be to define the column width and have the browser calculate the number of comparable products based off browser width. As an example:

A visitor is using a 1920 screen with browser at full width (1866px for argument's sake). This allows for 5 products and the row header column.

Visitor 2 is using an HTC One Mini in landscape giving a browser width of 1280px. This would, therefore, allow for 3 products and the row header column.

With a definable row header column width this calculation could be further refined.

Visitor 3 is using an iPhone 4 in landscape giving a browser width of 960px. This would allow for 2 products.

Anything that would only provide space for 1 product would automatically disable the comparison tool.

As I say I have styled this myself but have had to disable the comparison tool below 900px (that is the smallest I can style the 3 product limit I have chosen). With the calculations being handled by the browser this could really provide a neat additional to your comparison tool.

Please [Log in](/login?return=aHR0cHM6Ly93d3cuaGlrYXNob3AuY29tL2ZvcnVtLzUwLWZlYXR1cmUtcmVxdWVzdC84ODIyMTQtcmVzcG9uc2l2ZS1jb21wYXJpc29uLXRvb2w/dG1wbD1tYXJrZG93bg==) or [Create an account](/component/users/registration?Itemid=101) to join the conversation.

- **[nicolas](/forum/user/63-nicolas "View nicolas's Profile")**
- [![nicolas's Avatar](https://www.hikashop.com/media/kunena/avatars/resized/size144/users/avatar63.png)](/forum/user/63-nicolas "View nicolas's Profile")
- [ Away](/forum/user/63-nicolas)

Less More

- Posts: 86281
- Thank you received: 14262
-
-

10 years 8 months ago [\#229502](#229502) by [nicolas](/forum/user/63-nicolas "View nicolas's Profile")  Replied by *[nicolas](/forum/user/63-nicolas "View nicolas's Profile")* on topic *[Responsive Comparison Tool](/forum/50-feature-request/882214-responsive-comparison-tool#229502 "-- url of the page with the problem -- : localhost -- HikaShop version -- : 2.6.1 -- Joomla version -- : 3.4.8 -- PHP version -- : 5.6.8 -- Browser(s) name and version -- : FF44  I recognise that, to a degree, this is down to the designer/developer. However there is, perhaps, a simple suggestion that could be implemented to help people realise the comparison tool down to lower resolutions with more simplicity. Being that the use of a comparison tool is seeing the information on a variety of products in a &quot;side by side&quot; layout it does mean that below certain resolutions your &quot;maximum permitted&quot; products for comparison stops the tool being useful.  As an example I have the configuration set for 3 as my usable width per product in listing is about 300px (not too uncommon). So my choice of 3 is fairly logical as this allows me to have 3 products side by side with a row header column.  What might be a more &quot;usable&quot; option could be to define the column width and have the browser calculate the number of comparable products based off browser width. As an example:  A visitor is using a 1920 screen with browser at full width (1866px for argument's sake). This allows for 5 products and the row header column.  Visitor 2 is using an HTC One Mini in landscape giving a browser width of 1280px. This would, therefore, allow for 3 products and the row header column.  With a definable row header column width this calculation could be further refined.  Visitor 3 is using an iPhone 4 in landscape giving a browser width of 960px. This would allow for 2 products.  Anything that would only provide space for 1 product would automatically disable the comparison tool.  As I say I have styled this myself but have had to disable the comparison tool below 900px (that is the smallest I can style the 3 product limit I have chosen). With the calculations being handled by the browser this could really provide a neat additional to your comparison tool.")*

Hi,

It should be easy to disable the comparison system for low resolutions by just hiding the compare button on the listings for low resolutions: Code:

@media (max-width:900px) { .hikashop_compare_button { display: none; } }

The problem with providing a generic solution is that the template, the modules and even the width of the images of the products will be different for different websites and thus it's hard to set a defined width upon which HikaShop should reduce the number of products allowed for the comparison.
Furthermore, HikaShop doesn't necessarily know if the width available on the comparison page will be the same than the width available on the products listing where the compare buttons are. For example, it's quite easy to display a filter module on the left side of the products listing, and not have it on the comparison page. But the comparison system on the products listing has not way of knowing that and thus can't guess the width available on the comparison page to calculate the number of products allowed.

Please [Log in](/login?return=aHR0cHM6Ly93d3cuaGlrYXNob3AuY29tL2ZvcnVtLzUwLWZlYXR1cmUtcmVxdWVzdC84ODIyMTQtcmVzcG9uc2l2ZS1jb21wYXJpc29uLXRvb2w/dG1wbD1tYXJrZG93bg==) or [Create an account](/component/users/registration?Itemid=101) to join the conversation.

- **[teamtmedia](/forum/user/39167-teamtmedia "View teamtmedia's Profile")**
- [![teamtmedia's Avatar](https://www.hikashop.com/media/kunena/avatars/resized/size144/users/avatar39167.png)](/forum/user/39167-teamtmedia "View teamtmedia's Profile") Topic Author
- [ Offline](/forum/user/39167-teamtmedia)

Less More

- Posts: 38
- Thank you received: 0
-
-
-
-

10 years 8 months ago [\#229610](#229610) by [teamtmedia](/forum/user/39167-teamtmedia "View teamtmedia's Profile")  Replied by *[teamtmedia](/forum/user/39167-teamtmedia "View teamtmedia's Profile")* on topic *[Responsive Comparison Tool](/forum/50-feature-request/882214-responsive-comparison-tool#229610 "-- url of the page with the problem -- : localhost -- HikaShop version -- : 2.6.1 -- Joomla version -- : 3.4.8 -- PHP version -- : 5.6.8 -- Browser(s) name and version -- : FF44  I recognise that, to a degree, this is down to the designer/developer. However there is, perhaps, a simple suggestion that could be implemented to help people realise the comparison tool down to lower resolutions with more simplicity. Being that the use of a comparison tool is seeing the information on a variety of products in a &quot;side by side&quot; layout it does mean that below certain resolutions your &quot;maximum permitted&quot; products for comparison stops the tool being useful.  As an example I have the configuration set for 3 as my usable width per product in listing is about 300px (not too uncommon). So my choice of 3 is fairly logical as this allows me to have 3 products side by side with a row header column.  What might be a more &quot;usable&quot; option could be to define the column width and have the browser calculate the number of comparable products based off browser width. As an example:  A visitor is using a 1920 screen with browser at full width (1866px for argument's sake). This allows for 5 products and the row header column.  Visitor 2 is using an HTC One Mini in landscape giving a browser width of 1280px. This would, therefore, allow for 3 products and the row header column.  With a definable row header column width this calculation could be further refined.  Visitor 3 is using an iPhone 4 in landscape giving a browser width of 960px. This would allow for 2 products.  Anything that would only provide space for 1 product would automatically disable the comparison tool.  As I say I have styled this myself but have had to disable the comparison tool below 900px (that is the smallest I can style the 3 product limit I have chosen). With the calculations being handled by the browser this could really provide a neat additional to your comparison tool.")*

The css is the solution I'm using. The problem I have is that I know the acceptable widths of my columns (300px in my case) and I know the minimum width of my header row column (200px). This means that I know the amount of products that can be selected at any given resolution for the compare tool. The problem comes that it could easily accept 5 at the 1920 screen width and not be useful under 800px (rough for conversation sake).

My suggested solution involves admin input. I would simply enter my known values and an script would take care of the rest based on user resolution. This would allow your customers to implement the comparison tool in smaller screens providing more value for your product.

Please [Log in](/login?return=aHR0cHM6Ly93d3cuaGlrYXNob3AuY29tL2ZvcnVtLzUwLWZlYXR1cmUtcmVxdWVzdC84ODIyMTQtcmVzcG9uc2l2ZS1jb21wYXJpc29uLXRvb2w/dG1wbD1tYXJrZG93bg==) or [Create an account](/component/users/registration?Itemid=101) to join the conversation.

- **[nicolas](/forum/user/63-nicolas "View nicolas's Profile")**
- [![nicolas's Avatar](https://www.hikashop.com/media/kunena/avatars/resized/size144/users/avatar63.png)](/forum/user/63-nicolas "View nicolas's Profile")
- [ Away](/forum/user/63-nicolas)

Less More

- Posts: 86281
- Thank you received: 14262
-
-

10 years 8 months ago [\#229626](#229626) by [nicolas](/forum/user/63-nicolas "View nicolas's Profile")  Replied by *[nicolas](/forum/user/63-nicolas "View nicolas's Profile")* on topic *[Responsive Comparison Tool](/forum/50-feature-request/882214-responsive-comparison-tool#229626 "-- url of the page with the problem -- : localhost -- HikaShop version -- : 2.6.1 -- Joomla version -- : 3.4.8 -- PHP version -- : 5.6.8 -- Browser(s) name and version -- : FF44  I recognise that, to a degree, this is down to the designer/developer. However there is, perhaps, a simple suggestion that could be implemented to help people realise the comparison tool down to lower resolutions with more simplicity. Being that the use of a comparison tool is seeing the information on a variety of products in a &quot;side by side&quot; layout it does mean that below certain resolutions your &quot;maximum permitted&quot; products for comparison stops the tool being useful.  As an example I have the configuration set for 3 as my usable width per product in listing is about 300px (not too uncommon). So my choice of 3 is fairly logical as this allows me to have 3 products side by side with a row header column.  What might be a more &quot;usable&quot; option could be to define the column width and have the browser calculate the number of comparable products based off browser width. As an example:  A visitor is using a 1920 screen with browser at full width (1866px for argument's sake). This allows for 5 products and the row header column.  Visitor 2 is using an HTC One Mini in landscape giving a browser width of 1280px. This would, therefore, allow for 3 products and the row header column.  With a definable row header column width this calculation could be further refined.  Visitor 3 is using an iPhone 4 in landscape giving a browser width of 960px. This would allow for 2 products.  Anything that would only provide space for 1 product would automatically disable the comparison tool.  As I say I have styled this myself but have had to disable the comparison tool below 900px (that is the smallest I can style the 3 product limit I have chosen). With the calculations being handled by the browser this could really provide a neat additional to your comparison tool.")*

Hi,

Thank you for your feedback.

I see what you mean. With the admin configuring that manually it would be possible yes.
For now, if you want to do that specifically for your website, and if you know a bit of javascript, you can edit the javascript code of the file "compare" of the view "product" via the menu Display&gt;Views.

The following user(s) said Thank You: [teamtmedia](/forum/user/39167-teamtmedia "View teamtmedia's Profile")

Please [Log in](/login?return=aHR0cHM6Ly93d3cuaGlrYXNob3AuY29tL2ZvcnVtLzUwLWZlYXR1cmUtcmVxdWVzdC84ODIyMTQtcmVzcG9uc2l2ZS1jb21wYXJpc29uLXRvb2w/dG1wbD1tYXJrZG93bg==) or [Create an account](/component/users/registration?Itemid=101) to join the conversation.

- **[teamtmedia](/forum/user/39167-teamtmedia "View teamtmedia's Profile")**
- [![teamtmedia's Avatar](https://www.hikashop.com/media/kunena/avatars/resized/size144/users/avatar39167.png)](/forum/user/39167-teamtmedia "View teamtmedia's Profile") Topic Author
- [ Offline](/forum/user/39167-teamtmedia)

Less More

- Posts: 38
- Thank you received: 0
-
-
-
-

10 years 8 months ago [\#229747](#229747) by [teamtmedia](/forum/user/39167-teamtmedia "View teamtmedia's Profile")  Replied by *[teamtmedia](/forum/user/39167-teamtmedia "View teamtmedia's Profile")* on topic *[Responsive Comparison Tool](/forum/50-feature-request/882214-responsive-comparison-tool#229747 "-- url of the page with the problem -- : localhost -- HikaShop version -- : 2.6.1 -- Joomla version -- : 3.4.8 -- PHP version -- : 5.6.8 -- Browser(s) name and version -- : FF44  I recognise that, to a degree, this is down to the designer/developer. However there is, perhaps, a simple suggestion that could be implemented to help people realise the comparison tool down to lower resolutions with more simplicity. Being that the use of a comparison tool is seeing the information on a variety of products in a &quot;side by side&quot; layout it does mean that below certain resolutions your &quot;maximum permitted&quot; products for comparison stops the tool being useful.  As an example I have the configuration set for 3 as my usable width per product in listing is about 300px (not too uncommon). So my choice of 3 is fairly logical as this allows me to have 3 products side by side with a row header column.  What might be a more &quot;usable&quot; option could be to define the column width and have the browser calculate the number of comparable products based off browser width. As an example:  A visitor is using a 1920 screen with browser at full width (1866px for argument's sake). This allows for 5 products and the row header column.  Visitor 2 is using an HTC One Mini in landscape giving a browser width of 1280px. This would, therefore, allow for 3 products and the row header column.  With a definable row header column width this calculation could be further refined.  Visitor 3 is using an iPhone 4 in landscape giving a browser width of 960px. This would allow for 2 products.  Anything that would only provide space for 1 product would automatically disable the comparison tool.  As I say I have styled this myself but have had to disable the comparison tool below 900px (that is the smallest I can style the 3 product limit I have chosen). With the calculations being handled by the browser this could really provide a neat additional to your comparison tool.")*

Up against this release right now but will take a look at that later. Cheers for the heads-up. If I do get round to it I will share my findings with you.

Please [Log in](/login?return=aHR0cHM6Ly93d3cuaGlrYXNob3AuY29tL2ZvcnVtLzUwLWZlYXR1cmUtcmVxdWVzdC84ODIyMTQtcmVzcG9uc2l2ZS1jb21wYXJpc29uLXRvb2w/dG1wbD1tYXJrZG93bg==) or [Create an account](/component/users/registration?Itemid=101) to join the conversation.

- **[dafyalex](/forum/user/40197-dafyalex "View dafyalex's Profile")**
- [![dafyalex's Avatar](https://www.hikashop.com/media/kunena/core/svg/person.svg)](/forum/user/40197-dafyalex "View dafyalex's Profile")
- [ Offline](/forum/user/40197-dafyalex)

Less More

- Posts: 96
- Thank you received: 1
-
-

9 years 9 months ago [\#258297](#258297) by [dafyalex](/forum/user/40197-dafyalex "View dafyalex's Profile")  Replied by *[dafyalex](/forum/user/40197-dafyalex "View dafyalex's Profile")* on topic *[Responsive Comparison Tool](/forum/50-feature-request/882214-responsive-comparison-tool#258297 "-- url of the page with the problem -- : localhost -- HikaShop version -- : 2.6.1 -- Joomla version -- : 3.4.8 -- PHP version -- : 5.6.8 -- Browser(s) name and version -- : FF44  I recognise that, to a degree, this is down to the designer/developer. However there is, perhaps, a simple suggestion that could be implemented to help people realise the comparison tool down to lower resolutions with more simplicity. Being that the use of a comparison tool is seeing the information on a variety of products in a &quot;side by side&quot; layout it does mean that below certain resolutions your &quot;maximum permitted&quot; products for comparison stops the tool being useful.  As an example I have the configuration set for 3 as my usable width per product in listing is about 300px (not too uncommon). So my choice of 3 is fairly logical as this allows me to have 3 products side by side with a row header column.  What might be a more &quot;usable&quot; option could be to define the column width and have the browser calculate the number of comparable products based off browser width. As an example:  A visitor is using a 1920 screen with browser at full width (1866px for argument's sake). This allows for 5 products and the row header column.  Visitor 2 is using an HTC One Mini in landscape giving a browser width of 1280px. This would, therefore, allow for 3 products and the row header column.  With a definable row header column width this calculation could be further refined.  Visitor 3 is using an iPhone 4 in landscape giving a browser width of 960px. This would allow for 2 products.  Anything that would only provide space for 1 product would automatically disable the comparison tool.  As I say I have styled this myself but have had to disable the comparison tool below 900px (that is the smallest I can style the 3 product limit I have chosen). With the calculations being handled by the browser this could really provide a neat additional to your comparison tool.")*

Hi,

Is it normal that when I compare at least 3 products, I can't go to the right side of the page ?

Is it because the comparison page is not responsive ?

Here is the link : [ www.netweb3d.com/mauritiusproducts/fr/ca.../product/compare?cid](https://www.netweb3d.com/mauritiusproducts/fr/categories/product/compare?cid)[]=2&amp;cid[]=12&amp;cid[]=40

Best regards.

Please [Log in](/login?return=aHR0cHM6Ly93d3cuaGlrYXNob3AuY29tL2ZvcnVtLzUwLWZlYXR1cmUtcmVxdWVzdC84ODIyMTQtcmVzcG9uc2l2ZS1jb21wYXJpc29uLXRvb2w/dG1wbD1tYXJrZG93bg==) or [Create an account](/component/users/registration?Itemid=101) to join the conversation.

- **[nicolas](/forum/user/63-nicolas "View nicolas's Profile")**
- [![nicolas's Avatar](https://www.hikashop.com/media/kunena/avatars/resized/size144/users/avatar63.png)](/forum/user/63-nicolas "View nicolas's Profile")
- [ Away](/forum/user/63-nicolas)

Less More

- Posts: 86281
- Thank you received: 14262
-
-

9 years 9 months ago [\#258300](#258300) by [nicolas](/forum/user/63-nicolas "View nicolas's Profile")  Replied by *[nicolas](/forum/user/63-nicolas "View nicolas's Profile")* on topic *[Responsive Comparison Tool](/forum/50-feature-request/882214-responsive-comparison-tool#258300 "-- url of the page with the problem -- : localhost -- HikaShop version -- : 2.6.1 -- Joomla version -- : 3.4.8 -- PHP version -- : 5.6.8 -- Browser(s) name and version -- : FF44  I recognise that, to a degree, this is down to the designer/developer. However there is, perhaps, a simple suggestion that could be implemented to help people realise the comparison tool down to lower resolutions with more simplicity. Being that the use of a comparison tool is seeing the information on a variety of products in a &quot;side by side&quot; layout it does mean that below certain resolutions your &quot;maximum permitted&quot; products for comparison stops the tool being useful.  As an example I have the configuration set for 3 as my usable width per product in listing is about 300px (not too uncommon). So my choice of 3 is fairly logical as this allows me to have 3 products side by side with a row header column.  What might be a more &quot;usable&quot; option could be to define the column width and have the browser calculate the number of comparable products based off browser width. As an example:  A visitor is using a 1920 screen with browser at full width (1866px for argument's sake). This allows for 5 products and the row header column.  Visitor 2 is using an HTC One Mini in landscape giving a browser width of 1280px. This would, therefore, allow for 3 products and the row header column.  With a definable row header column width this calculation could be further refined.  Visitor 3 is using an iPhone 4 in landscape giving a browser width of 960px. This would allow for 2 products.  Anything that would only provide space for 1 product would automatically disable the comparison tool.  As I say I have styled this myself but have had to disable the comparison tool below 900px (that is the smallest I can style the 3 product limit I have chosen). With the calculations being handled by the browser this could really provide a neat additional to your comparison tool.")*

Hi,

Yes and no.
There are several ways you could have the whole comparison table display on small resolutions on your page:
- improve the custom CSS you have for your buttons and tables in order to use less space. For example, you should be able to easily achieve this: [ take.ms/fPuWo](http://take.ms/fPuWo)
- improve the CSS of the template to allow the display of a horizontal scrollbar. Right now, the CSS of the template prevents that and thus, when the content goes over the browser window horizontally, you can't access it.
- make the comparison table responsive with additional custom CSS. You could do that quite easily with a bit of CSS: [ www.w3schools.com/howto/howto\_css\_table\_responsive.asp](http://www.w3schools.com/howto/howto_css_table_responsive.asp)

Please [Log in](/login?return=aHR0cHM6Ly93d3cuaGlrYXNob3AuY29tL2ZvcnVtLzUwLWZlYXR1cmUtcmVxdWVzdC84ODIyMTQtcmVzcG9uc2l2ZS1jb21wYXJpc29uLXRvb2w/dG1wbD1tYXJrZG93bg==) or [Create an account](/component/users/registration?Itemid=101) to join the conversation.

- **[dafyalex](/forum/user/40197-dafyalex "View dafyalex's Profile")**
- [![dafyalex's Avatar](https://www.hikashop.com/media/kunena/core/svg/person.svg)](/forum/user/40197-dafyalex "View dafyalex's Profile")
- [ Offline](/forum/user/40197-dafyalex)

Less More

- Posts: 96
- Thank you received: 1
-
-

9 years 9 months ago [\#258363](#258363) by [dafyalex](/forum/user/40197-dafyalex "View dafyalex's Profile")  Replied by *[dafyalex](/forum/user/40197-dafyalex "View dafyalex's Profile")* on topic *[Responsive Comparison Tool](/forum/50-feature-request/882214-responsive-comparison-tool#258363 "-- url of the page with the problem -- : localhost -- HikaShop version -- : 2.6.1 -- Joomla version -- : 3.4.8 -- PHP version -- : 5.6.8 -- Browser(s) name and version -- : FF44  I recognise that, to a degree, this is down to the designer/developer. However there is, perhaps, a simple suggestion that could be implemented to help people realise the comparison tool down to lower resolutions with more simplicity. Being that the use of a comparison tool is seeing the information on a variety of products in a &quot;side by side&quot; layout it does mean that below certain resolutions your &quot;maximum permitted&quot; products for comparison stops the tool being useful.  As an example I have the configuration set for 3 as my usable width per product in listing is about 300px (not too uncommon). So my choice of 3 is fairly logical as this allows me to have 3 products side by side with a row header column.  What might be a more &quot;usable&quot; option could be to define the column width and have the browser calculate the number of comparable products based off browser width. As an example:  A visitor is using a 1920 screen with browser at full width (1866px for argument's sake). This allows for 5 products and the row header column.  Visitor 2 is using an HTC One Mini in landscape giving a browser width of 1280px. This would, therefore, allow for 3 products and the row header column.  With a definable row header column width this calculation could be further refined.  Visitor 3 is using an iPhone 4 in landscape giving a browser width of 960px. This would allow for 2 products.  Anything that would only provide space for 1 product would automatically disable the comparison tool.  As I say I have styled this myself but have had to disable the comparison tool below 900px (that is the smallest I can style the 3 product limit I have chosen). With the calculations being handled by the browser this could really provide a neat additional to your comparison tool.")*

Hi,

I added &lt;div style="overflow-x:auto;"&gt; just before the table in product/compare, and I get a horizontal scroll bar.
That's fine. Thank's

But now, I try to reduce the width of the columns, but nothing works : in CSS or in view.

You'll see it in : [ netweb3d.com/mauritiusproducts/fr/catego.../product/compare?cid](https://netweb3d.com/mauritiusproducts/fr/categories/product/compare?cid)[]=4&amp;cid[]=19&amp;cid[]=58

Thank's for your help.

Please [Log in](/login?return=aHR0cHM6Ly93d3cuaGlrYXNob3AuY29tL2ZvcnVtLzUwLWZlYXR1cmUtcmVxdWVzdC84ODIyMTQtcmVzcG9uc2l2ZS1jb21wYXJpc29uLXRvb2w/dG1wbD1tYXJrZG93bg==) or [Create an account](/component/users/registration?Itemid=101) to join the conversation.

- **[nicolas](/forum/user/63-nicolas "View nicolas's Profile")**
- [![nicolas's Avatar](https://www.hikashop.com/media/kunena/avatars/resized/size144/users/avatar63.png)](/forum/user/63-nicolas "View nicolas's Profile")
- [ Away](/forum/user/63-nicolas)

Less More

- Posts: 86281
- Thank you received: 14262
-
-

9 years 9 months ago [\#258364](#258364) by [nicolas](/forum/user/63-nicolas "View nicolas's Profile")  Replied by *[nicolas](/forum/user/63-nicolas "View nicolas's Profile")* on topic *[Responsive Comparison Tool](/forum/50-feature-request/882214-responsive-comparison-tool#258364 "-- url of the page with the problem -- : localhost -- HikaShop version -- : 2.6.1 -- Joomla version -- : 3.4.8 -- PHP version -- : 5.6.8 -- Browser(s) name and version -- : FF44  I recognise that, to a degree, this is down to the designer/developer. However there is, perhaps, a simple suggestion that could be implemented to help people realise the comparison tool down to lower resolutions with more simplicity. Being that the use of a comparison tool is seeing the information on a variety of products in a &quot;side by side&quot; layout it does mean that below certain resolutions your &quot;maximum permitted&quot; products for comparison stops the tool being useful.  As an example I have the configuration set for 3 as my usable width per product in listing is about 300px (not too uncommon). So my choice of 3 is fairly logical as this allows me to have 3 products side by side with a row header column.  What might be a more &quot;usable&quot; option could be to define the column width and have the browser calculate the number of comparable products based off browser width. As an example:  A visitor is using a 1920 screen with browser at full width (1866px for argument's sake). This allows for 5 products and the row header column.  Visitor 2 is using an HTC One Mini in landscape giving a browser width of 1280px. This would, therefore, allow for 3 products and the row header column.  With a definable row header column width this calculation could be further refined.  Visitor 3 is using an iPhone 4 in landscape giving a browser width of 960px. This would allow for 2 products.  Anything that would only provide space for 1 product would automatically disable the comparison tool.  As I say I have styled this myself but have had to disable the comparison tool below 900px (that is the smallest I can style the 3 product limit I have chosen). With the calculations being handled by the browser this could really provide a neat additional to your comparison tool.")*

Hi,

You have added that CSS: Code:

.hikashop_compare_page .hikashop_product_stock div#hikashop_add_wishlist a.hikashop_cart_button { margin-left: 200px; text-align: center; display: inline-block; width: 180px !important; height: 35px !important; }

in [ www.netweb3d.com/mauritiusproducts/media...tom.css?t=1482768386](https://www.netweb3d.com/mauritiusproducts/media/com_hikashop/css/frontend_custom.css?t=1482768386)
Remove the line:
margin-left: 200px;
and you'll see that it will already look a lot more smaller.

Please [Log in](/login?return=aHR0cHM6Ly93d3cuaGlrYXNob3AuY29tL2ZvcnVtLzUwLWZlYXR1cmUtcmVxdWVzdC84ODIyMTQtcmVzcG9uc2l2ZS1jb21wYXJpc29uLXRvb2w/dG1wbD1tYXJrZG93bg==) or [Create an account](/component/users/registration?Itemid=101) to join the conversation.

- **[dafyalex](/forum/user/40197-dafyalex "View dafyalex's Profile")**
- [![dafyalex's Avatar](https://www.hikashop.com/media/kunena/core/svg/person.svg)](/forum/user/40197-dafyalex "View dafyalex's Profile")
- [ Offline](/forum/user/40197-dafyalex)

Less More

- Posts: 96
- Thank you received: 1
-
-

9 years 9 months ago -  9 years 9 months ago [\#258406](#258406) by [dafyalex](/forum/user/40197-dafyalex "View dafyalex's Profile")  Replied by *[dafyalex](/forum/user/40197-dafyalex "View dafyalex's Profile")* on topic *[Responsive Comparison Tool](/forum/50-feature-request/882214-responsive-comparison-tool#258406 "-- url of the page with the problem -- : localhost -- HikaShop version -- : 2.6.1 -- Joomla version -- : 3.4.8 -- PHP version -- : 5.6.8 -- Browser(s) name and version -- : FF44  I recognise that, to a degree, this is down to the designer/developer. However there is, perhaps, a simple suggestion that could be implemented to help people realise the comparison tool down to lower resolutions with more simplicity. Being that the use of a comparison tool is seeing the information on a variety of products in a &quot;side by side&quot; layout it does mean that below certain resolutions your &quot;maximum permitted&quot; products for comparison stops the tool being useful.  As an example I have the configuration set for 3 as my usable width per product in listing is about 300px (not too uncommon). So my choice of 3 is fairly logical as this allows me to have 3 products side by side with a row header column.  What might be a more &quot;usable&quot; option could be to define the column width and have the browser calculate the number of comparable products based off browser width. As an example:  A visitor is using a 1920 screen with browser at full width (1866px for argument's sake). This allows for 5 products and the row header column.  Visitor 2 is using an HTC One Mini in landscape giving a browser width of 1280px. This would, therefore, allow for 3 products and the row header column.  With a definable row header column width this calculation could be further refined.  Visitor 3 is using an iPhone 4 in landscape giving a browser width of 960px. This would allow for 2 products.  Anything that would only provide space for 1 product would automatically disable the comparison tool.  As I say I have styled this myself but have had to disable the comparison tool below 900px (that is the smallest I can style the 3 product limit I have chosen). With the calculations being handled by the browser this could really provide a neat additional to your comparison tool.")*

Hi,

Ok, I didnt see this. It work well whithout it. Thank's.

And now, another thing I would wish to do in comparison tool, is to modify the Quantity field : Code:

https://netweb3d.com/mauritiusproducts/fr/produits/product/compare?cid[]=2&amp;cid[]=19&amp;cid[]=34

As you have see, it's not the same than on the other pages with products, for exemple :

[ netweb3d.com/mauritiusproducts/fr/catego...gory/25-thes-maurice](https://netweb3d.com/mauritiusproducts/fr/categories/category/25-thes-maurice)

How can I do to get the same quantity field (option Show select in background) ?

Best regards.

Last edit: 9 years 9 months ago by [Jerome](/forum/user/80-jerome "View Jerome's Profile"). Reason: fix link

Please [Log in](/login?return=aHR0cHM6Ly93d3cuaGlrYXNob3AuY29tL2ZvcnVtLzUwLWZlYXR1cmUtcmVxdWVzdC84ODIyMTQtcmVzcG9uc2l2ZS1jb21wYXJpc29uLXRvb2w/dG1wbD1tYXJrZG93bg==) or [Create an account](/component/users/registration?Itemid=101) to join the conversation.

- **[nicolas](/forum/user/63-nicolas "View nicolas's Profile")**
- [![nicolas's Avatar](https://www.hikashop.com/media/kunena/avatars/resized/size144/users/avatar63.png)](/forum/user/63-nicolas "View nicolas's Profile")
- [ Away](/forum/user/63-nicolas)

Less More

- Posts: 86281
- Thank you received: 14262
-
-

9 years 9 months ago [\#258435](#258435) by [nicolas](/forum/user/63-nicolas "View nicolas's Profile")  Replied by *[nicolas](/forum/user/63-nicolas "View nicolas's Profile")* on topic *[Responsive Comparison Tool](/forum/50-feature-request/882214-responsive-comparison-tool#258435 "-- url of the page with the problem -- : localhost -- HikaShop version -- : 2.6.1 -- Joomla version -- : 3.4.8 -- PHP version -- : 5.6.8 -- Browser(s) name and version -- : FF44  I recognise that, to a degree, this is down to the designer/developer. However there is, perhaps, a simple suggestion that could be implemented to help people realise the comparison tool down to lower resolutions with more simplicity. Being that the use of a comparison tool is seeing the information on a variety of products in a &quot;side by side&quot; layout it does mean that below certain resolutions your &quot;maximum permitted&quot; products for comparison stops the tool being useful.  As an example I have the configuration set for 3 as my usable width per product in listing is about 300px (not too uncommon). So my choice of 3 is fairly logical as this allows me to have 3 products side by side with a row header column.  What might be a more &quot;usable&quot; option could be to define the column width and have the browser calculate the number of comparable products based off browser width. As an example:  A visitor is using a 1920 screen with browser at full width (1866px for argument's sake). This allows for 5 products and the row header column.  Visitor 2 is using an HTC One Mini in landscape giving a browser width of 1280px. This would, therefore, allow for 3 products and the row header column.  With a definable row header column width this calculation could be further refined.  Visitor 3 is using an iPhone 4 in landscape giving a browser width of 960px. This would allow for 2 products.  Anything that would only provide space for 1 product would automatically disable the comparison tool.  As I say I have styled this myself but have had to disable the comparison tool below 900px (that is the smallest I can style the 3 product limit I have chosen). With the calculations being handled by the browser this could really provide a neat additional to your comparison tool.")*

Hi,

The comparison system doesn't support that for now.
You would have to edit the file "compare" of the view "product" via the menu Display&gt;Views and add such code: Code:

if(!empty($this-&gt;row-&gt;product_quantity_layout) &amp;&amp; $this-&gt;row-&gt;product_quantity_layout != 'inherit'){ $qLayout = $this-&gt;row-&gt;product_quantity_layout; }else{ $categoryQuantityLayout = ''; if(!empty($this-&gt;row-&gt;categories) ) { foreach($this-&gt;row-&gt;categories as $category) { if(!empty($category-&gt;category_quantity_layout) &amp;&amp; $this-&gt;quantityDisplayType-&gt;check($category-&gt;category_quantity_layout, $app-&gt;getTemplate())) { $categoryQuantityLayout = $category-&gt;category_quantity_layout; break; } } } if(!empty($categoryQuantityLayout) &amp;&amp; $categoryQuantityLayout != 'inherit'){ $qLayout = $categoryQuantityLayout; }else{ $qLayout = $this-&gt;config-&gt;get('product_quantity_display','show_default'); } } JRequest::setVar('quantitylayout',$qLayout);

before the code: Code:

$this-&gt;setLayout('quantity'); echo $this-&gt;loadTemplate();

in order to support that.

Please [Log in](/login?return=aHR0cHM6Ly93d3cuaGlrYXNob3AuY29tL2ZvcnVtLzUwLWZlYXR1cmUtcmVxdWVzdC84ODIyMTQtcmVzcG9uc2l2ZS1jb21wYXJpc29uLXRvb2w/dG1wbD1tYXJrZG93bg==) or [Create an account](/component/users/registration?Itemid=101) to join the conversation.

- **[dafyalex](/forum/user/40197-dafyalex "View dafyalex's Profile")**
- [![dafyalex's Avatar](https://www.hikashop.com/media/kunena/core/svg/person.svg)](/forum/user/40197-dafyalex "View dafyalex's Profile")
- [ Offline](/forum/user/40197-dafyalex)

Less More

- Posts: 96
- Thank you received: 1
-
-

9 years 9 months ago [\#258460](#258460) by [dafyalex](/forum/user/40197-dafyalex "View dafyalex's Profile")  Replied by *[dafyalex](/forum/user/40197-dafyalex "View dafyalex's Profile")* on topic *[Responsive Comparison Tool](/forum/50-feature-request/882214-responsive-comparison-tool#258460 "-- url of the page with the problem -- : localhost -- HikaShop version -- : 2.6.1 -- Joomla version -- : 3.4.8 -- PHP version -- : 5.6.8 -- Browser(s) name and version -- : FF44  I recognise that, to a degree, this is down to the designer/developer. However there is, perhaps, a simple suggestion that could be implemented to help people realise the comparison tool down to lower resolutions with more simplicity. Being that the use of a comparison tool is seeing the information on a variety of products in a &quot;side by side&quot; layout it does mean that below certain resolutions your &quot;maximum permitted&quot; products for comparison stops the tool being useful.  As an example I have the configuration set for 3 as my usable width per product in listing is about 300px (not too uncommon). So my choice of 3 is fairly logical as this allows me to have 3 products side by side with a row header column.  What might be a more &quot;usable&quot; option could be to define the column width and have the browser calculate the number of comparable products based off browser width. As an example:  A visitor is using a 1920 screen with browser at full width (1866px for argument's sake). This allows for 5 products and the row header column.  Visitor 2 is using an HTC One Mini in landscape giving a browser width of 1280px. This would, therefore, allow for 3 products and the row header column.  With a definable row header column width this calculation could be further refined.  Visitor 3 is using an iPhone 4 in landscape giving a browser width of 960px. This would allow for 2 products.  Anything that would only provide space for 1 product would automatically disable the comparison tool.  As I say I have styled this myself but have had to disable the comparison tool below 900px (that is the smallest I can style the 3 product limit I have chosen). With the calculations being handled by the browser this could really provide a neat additional to your comparison tool.")*

Hi,

It works perfectly !

Thank you very much for your effective et quick support.

Best regards.

Please [Log in](/login?return=aHR0cHM6Ly93d3cuaGlrYXNob3AuY29tL2ZvcnVtLzUwLWZlYXR1cmUtcmVxdWVzdC84ODIyMTQtcmVzcG9uc2l2ZS1jb21wYXJpc29uLXRvb2w/dG1wbD1tYXJrZG93bg==) or [Create an account](/component/users/registration?Itemid=101) to join the conversation.

Board Categories HikaShop- Install &amp; Update- Product &amp; Category Display- Content Creation- Sales and Orders- - Orders management- - Reports &amp; Statistics- Customers- Checkout- Payment Methods- Shipping Methods- Import &amp; Export (CSV, XLS…)- Specific Features- - Affilation- - Taxes- - Wishlist- - Vote- - Carousel &amp; Slider- - Mass Actions- - Filters &amp; Search- - Discount &amp; Coupon- - Feature Request- Integrations- Showcase- General Talk about HikaShop- Development- - HikaShop 3.0 Beta- Translation- Commercial Jobs HikaShop Components- HikaMarket- - Market: Feature requests- - Market: How to?- - Market: Bug Report- HikaSerial- - General talk about HikaSerial- - Serial: Bug Report- - Serial: How to?- - Support en Français de HikaSerial (French Support)- - HikaSubscription- HikaAuction- - Auction: Feature requests- - Auction: How to?- - Auction: Bug report Hikashop around the world- Support en Français (French Support)- Russian- - FAQ. Курс выживания с Hikashop. Частые вопросы и о- - Расширения Hikashop- - Наши сайты на Hikashop- 日本語版サポート(Japanese Support)- Thai- German Archives- Bug Report- How to?

[](/forum/topics/feed/mode-topics?format=feed&type=rss)

Time to create page: 0.331 seconds

[Powered by](/forum/credits) [Kunena Forum](https://www.kunena.org)

[](#top)
