YOOtheme Pro is here! The best WordPress and Joomla theme. Learn more

Avatar no64 asked

UIkit - Slider or Slideset with 7 items

Is there a way to set a UIkit Slider or Slideset to 7 Items?
I know there is no 7 in the uk-width classes, so tried to add a custom CSS

.uk-grid-width-large-1-7 {
width:14.2857%;
}

but that doesn't work.

Why aren't there uk-width classes 7, 8 and 9 anyway?

  • Widgetkit
  • UIkit

Edited

5 Answers

0

Avatar philipp Yootheme answered

Hi,
I am sorry for the late response,
we thought that these numbers wouldn't be used so much and since this is a "simple" width adjustment this could easily be added by the ones needing it.
Another reason is the percentage you see in your code above, this often causes pixel miscalculation errors within the browsers, so that there a 1px wide white stripe visible.

After adding the class above how did you add it into the widget?
Because this should work that way.

Kind Regards
Philipp

0

Avatar no64 answered

Hi Philipp... I'm sorry too... haven't got back to this yet, but I am working on a "custom" sliderelement/position for ZOO

I have something like this:

   <div class="uk-slidenav-position" data-uk-slider="{infinite: false}">  

    <a href="" class="uk-slidenav uk-slidenav-contrast uk-slidenav-previous" data-uk-slider-item="previous"></a>  
    <a href="" class="uk-slidenav uk-slidenav-contrast uk-slidenav-next" data-uk-slider-item="next"></a>  

        <div class="uk-slider-container uk-grid-small uk-container-center">  
            <ul class="uk-slider uk-grid-width-small-1-2 uk-grid-width-medium-1-4 uk-grid-width-large-1-7">  
                <li>  
                    <div>...</div>  
                </li>  
            </ul>  
        </div>  
   </div>  

Edited

0

Avatar philipp Yootheme answered

But doesn't it work for you when you just add the classes you need for example:

.uk-grid-width-large-1-7 {  
    width:14.2857%;  
}

Into your custom CSS? Since the JS part of this shouldn't be effected by the width, so when you add all the width classes you need for your project it should work as if they would come with UIkit2 by default...

0

Avatar no64 answered

yes,... I have added that to my custom css

but... I think, I have some css problem with the grid gutter...with 7 items they are ok... but on smaller devices the items are overlapping...
I think, I have to rebuild the whole thing to investigate...

May I come back for help if it isn't my fault?

0

Avatar philipp Yootheme answered

Oh this sounds really weird. Yes please feel free to ask when you encounter any problem :)

Kind Regards
Philipp

Know someone who can answer? Share a link to this question via email or twitter.