Template parts not responsive

  • Posts: 44
  • Thank you received: 2
9 years 3 months ago #241880

-- url of the page with the problem -- : koffiematters.nl/koffiemachine-kopen/cat...ory/13-jura-occasion
-- HikaShop version -- : 2.6.3
-- Joomla version -- : 3.4.8

I hope you guys / ladies can help me out here with a CSS problem.
The product overview page isn't responsive and can't find out how to fix this issue.

At this moment the .hikashop_container divs are overlapping eachother, instead of jumping to the next line.

Many thanks in advance!
Hielke

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

  • Posts: 4820
  • Thank you received: 654
  • MODERATOR
9 years 3 months ago #241888

Hello,

For your needs I suggest you to use/modify your Css code, for customize your product page via your Css,
have a look on this link, here .

Note : I advice you to edit your Css file at the end, later that will be easier to find and correct it.

As example :

@media (max-width: 767px)
[class*="span"], .uneditable-input[class*="span"], .row-fluid [class*="span"] {
    float: none;
    display: block;
    width: 100%;
    margin-left: 0;
}

To learn more about Css code and their properties, I invite you to read this source, here .
And more especially this point about @media in order to have several Css order link to screen size.

Hope that will help you.

Regards,

Last edit: 9 years 3 months ago by Philip.
The following user(s) said Thank You: hielkio

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

  • Posts: 44
  • Thank you received: 2
9 years 3 months ago #242945

I solved it for the products, great :)
But .. I can't get the filter section showing up correctly on mobile devices



I tried many things, but none worked well :(
What I hope for, is that someone can post the correct css part, so I could learn from it.

Many thanks in Advance!

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

  • Posts: 4820
  • Thank you received: 654
  • MODERATOR
9 years 3 months ago #242989

Hello,

It's because there is several point to modify, as change <div class="hikashop_filter_main"> width to switch it like 100%
Add some margin and display : block; in order to have each filter one below the other.

see this example :

.hikashop_filter_main {
    width: 100% !important;
}

There is several other order to add in your custom Css file.
But note that this forum aim is to help about HikaShop issue and configuration.

Hope this will help you.

Regards

Last edit: 9 years 3 months ago by Philip.

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

Time to create page: 0.059 seconds
Powered by Kunena Forum