Size of hikashop_product_quantity_div

  • Posts: 27
  • Thank you received: 1
  • Hikashop Business
4 years 3 months ago #326205

-- HikaShop version -- : 4.3.0
-- Joomla version -- : 3.9.22
-- PHP version -- : 7.3.24
-- Browser(s) name and version -- : Firefox

I use the template of Yootheme Pro and in Hikashop
I cannot find the place to style the input field of the product quantity. In the source code I find:
height: 50 px:
But where can I change the weight to 50px;? Or whre can i put this code?

On the screen its now very weight and not very nice looking. Its a problem of the styling of the Yootheme template? Or can I find in Hikashop a solution?

Attachments:

Please Log in or Create an account to join the conversation.

  • Posts: 12953
  • Thank you received: 1778
4 years 3 months ago #326301

Hello,

Sure, using the following CSS code will do the job :

.hikashop_product_page #hikashop_product_right_part #hikashop_product_quantity_main .hikashop_product_quantity_field {
    width: 50px;
}

For more information about CSS customization :
www.hikashop.com/support/documentation/1...the-display.html#css

Kind regards,
Mohamed.

Please Log in or Create an account to join the conversation.

  • Posts: 27
  • Thank you received: 1
  • Hikashop Business
4 years 3 months ago #326474

Hi
I have put your message in the source of custom.css in Hikashop. But no reaction. Problem styling with the template of Yootheme?

When I go to the inspector of my browser and change by hand the code with wdith: 50px; everything changes.

Attachments:

Please Log in or Create an account to join the conversation.

  • Posts: 12953
  • Thank you received: 1778
4 years 3 months ago #326493

Hello,

Firstly, you should check that :
- the "frontend_custom.css" file is used through "Front-end CSS File" / "Styles for the front-end" options
- your website/browser's cache is cleared, you can also test it with another browser
- your theme don't have any option which prevent that code from being used.

Kind regards,
Mohamed.

Please Log in or Create an account to join the conversation.

  • Posts: 27
  • Thank you received: 1
  • Hikashop Business
4 years 3 months ago #326530

Hi
I have tried another browser. Nothing happened.
I see on the right in the source code: theme.9.css. There is also the height of 50 px;
When I write 'width: 50px;' to the same place in the source everything goes OK.

In Hikashop I use custom in frontend css. See the screen dumps.

Attachments:

Please Log in or Create an account to join the conversation.

  • Posts: 4816
  • Thank you received: 654
  • MODERATOR
4 years 3 months ago #326550

Hello,

I think there are a misunderstood, here, do you want to modify the height or the width ?
Because on your first message you speak about the weight, let's detail possibilities :
For width :
width: 50px;
For height :
height : 50px.



I check on your product page, your selector is good and so replace with your required css command, and that may work.
Regards

Last edit: 4 years 3 months ago by Philip.

Please Log in or Create an account to join the conversation.

  • Posts: 27
  • Thank you received: 1
  • Hikashop Business
4 years 3 months ago #326570

Thnks!!
Thats OK now. Working.
But there is a page before the product page with the same problem. What the name of this page?
something like this?

.hikashop_product_listing_page
#hikashop_product_right_part
#hikashop_product_quantity_main
.hikashop_product_quantity_field {
width: 50px;
height: 50px;
}

Attachments:

Please Log in or Create an account to join the conversation.

  • Posts: 4816
  • Thank you received: 654
  • MODERATOR
4 years 3 months ago #326583

Hello,

You have to use the inspector tool in order to get html class, and be able to build your Css selector.
Point an element in the listing "grid" and right-click => Inspector tool (or inspect).

Then go up the hierarchy of parent-child containers, to get the general container of your product listing, and try to find the most specific Class or better Id, see my screenshot :



And create your command Css, hope this will help you to move forward on your subject.
Regards

Last edit: 4 years 3 months ago by Philip.

Please Log in or Create an account to join the conversation.

  • Posts: 27
  • Thank you received: 1
  • Hikashop Business
4 years 3 months ago #326624

And yes!!!

.hikashop_product_quantity_div { display: inline-block; width:50px; }

its working. Many thnks

The following user(s) said Thank You: Philip

Please Log in or Create an account to join the conversation.

  • Posts: 4816
  • Thank you received: 654
  • MODERATOR
4 years 3 months ago #326721

Hello,

Always happy to be useful ! Thanks for this nice return !
If you want help us, leave a comment about our work, here on the Joomla Extension Directory.

Regards

Please Log in or Create an account to join the conversation.

Time to create page: 0.104 seconds
Powered by Kunena Forum